我在使用jquery sortable时遇到了一些问题...
在排序之后,触发的元素的click事件被触发,并且在此之上,拖动模式没有得到恢复,因此该元素保留所有的线条样式(例如,position:绝对)由插件创建!
我写了一个触发问题的类似情况:
html
<ul>
</ul>
<p class="add">add</p>
js:
$(document).ready( function() {
$("ul").sortable();
$('.add').click(function(){
var $li = $('<li>').appendTo( $('ul') )
var $a = $('<a>').attr('href','#').text('test' + ($('a').length + 1) ).appendTo($li)
$li.bind('click', function(){
activate($li)
return false
})
})
$(document).bind('click.outside', function(){
alert('click outside')
})
});
function activate($li){
$('a', $li).text('click');
}
activate()将新元素添加到列表中并将单击处理程序绑定到它们。点击触发元素的“激活”。问题是即使在排序后也会触发click事件,并且我确实不想要这个!
如果使用添加功能之外的live()将事件绑定到$ li,则不会出现此问题:
$(document).ready( function() {
$("ul").sortable();
$('.add').click(function(){
var $li = $('<li>').appendTo( $('ul') )
var $a = $('<a>').attr('href','#').text('test' + ($('a').length + 1) ).appendTo($li)
return false;
})
$('li').live('click', function(){
activate($(this))
return false;
})
$(document).bind('click.outside', function(){
alert('click outside')
})
});
function activate($li){
$('a', $li).text('click');
}
但我不想这样做,因为我想将事件处理程序绑定到文档以捕获元素之外的点击,而live(),如你所知,即使返回false也不能停止事件传播。
有什么想法吗?