代码之家 › 专栏 › 技术社区 › tpae

.hide()/.show()和dropable

droppable draggable jquery-ui jquery

tpae · 技术社区 · 14 年前

我有一个问题,当draggable触发器drag时元素调用.show(),不允许我放入dropable。我怎样才能解决这个问题?

$(document).ready(function() {
$(".folder").droppable({
        greedy: true,
        drop: function(event, ui) {
            $(".folder").hide();
        },
        tolerance: 'touch'
    });

$(".folder").hide();
$(".draggable_folder").draggable({ 
    cursor: 'move',
    cursorAt: { top: 8, left: 0 },
    drag: function(event, ui) {
        $(".folder").show();
    },
    helper: function(event) {
        var subject = $(this).find('.message_subject').html();
        return $('<div class="ui-widget-header" style="max-width: 100px;">'+subject+'</div>');
    }
});
});

<ul>
    <li class="folder">{$folders[f_list].name}</a><div style="clear:both"></div></li>
</ul>
<table>
    <tr class="draggable_folder"><td>test</td></tr>
</table>

1 回复 | 直到 14 年前

Gert Grenander Keiron Lowe 14 年前

在 $(".draggable_folder").draggable ,更改 drag: function(event, ui) 到 start: function() . 这将使 .folder 可见,可拖放将变为活动状态。draggable的最终代码:

$(".draggable_folder").draggable({ 
  cursor: 'move',
  cursorAt: { top: 8, left: 0 },
  start: function() {
    $(".folder").show();
  },
  helper: function(event) {
    var subject = $(this).find('.message_subject').html();
    return $('<div class="ui-widget-header" style="max-width: 100px;">'+subject+'</div>');
  }
});

推荐文章

Newbie_Coder · 如何使用Jquery无画布裁剪框架

1 年前

usman610 · Javascript代码在点击回车键和点击按钮时删除行

1 年前

NovoMannen · 导航中的下拉菜单在内容后面重叠

1 年前

Carly · 在页面加载时滑入div,然后单击以滑入和滑出(jQuery)

1 年前

Community wiki · jquery弹出窗口不会用按键关闭,但会点击

1 年前

Community wiki · Smarty IE9请求下载index.php文件(在上传未发生后)?是我的代码出错还是activecollab?

1 年前

Community wiki · 无法从jquery文档调用函数

1 年前

marzouk najib · Uncaught ReferenceError:未定义FullCalendar

2 年前

Pepe · 检查“data”属性是否包含输入值的一部分(jQuery)

2 年前

laurence keith albano · 如何使用Jquery在父类内添加子父类

2 年前