排序后触发点击可排序 jQuery UI

Question

此问题发生在 Safari 上。我在 IE 上没有遇到这个问题（这是第一次）。

我有一个可排序的：

<ul id='srt'>
    <li><a class='url' href='http://www.test.com'>test</a></li>
    <li><a class='url' href='http://www.test1com'>test1</a></li>
    <li><a class='url' href='http://www.test2com'>test2</a></li>
</ul>

和以下脚本：

$(document).ready( function() {
    $("#srt").sortable();

    $(".url").click( test );
});

function test() {
    $(this).text( "done" );
    return false;
}>

单击链接会将文本更改为“完成”，但拖动它也会将文本更改为“完成”。但我不想点击排序末尾的链接。

就像我说的：IE 正在按应有的方式运行该功能，它对链接进行排序并且不会触发绑定的单击功能，但 Safari 确实会触发单击...

我怎样才能防止这种情况发生？

编辑：我为此创建了一个 jFiddle ，以便您可以尝试一下。

Answer 1

实际上，我在当前的项目中遇到了同样的问题，而且我真的没有任何线索，因为一开始工作正常，但在代码发生一些变化后，它停止工作。问题是我做了很多改变，我无法想象哪个会造成问题，

幸运的是，在你的情况下，Hwr 更简单。你永远不应该在 jquery 中传递这样的事件处理程序。使用这个语法：

$(".url").click( function(){
    test();
});

这有效！

编辑：
抱歉，排序时它仍然会触发处理程序。解决办法有两个！

最好的一个：

$("#srt").sortable({ helper: 'clone' });
$(".url").click( function() { $(this).text( "done" ); } );

使用 helper: 'clone' 选项避免插件在元素上运行处理程序。 （请注意，我将 test() 主体包含到匿名函数中，否则您将无法使用“this”）

更丑陋的一个会导致事件冒泡问题：

$("#srt").sortable();

$(".url").live('click', function() { $(this).text( "done" ); } );

这只是出于教学原因！由于 live() 事件不在元素本身中，因此它们不会被 sortable 触发！