jquery-ui - jquery uiソート可能なトリガークリック

Question

jquery sortableに問題があります...

並べ替えの後、ドロップされた要素のクリック イベントがトリガーされ、さらに、ドラッグ モードが元に戻されないため、要素は作成されたインライン スタイル (例: position:absolute) をすべて保持します。プラグインで！

問題を引き起こす同様の状況を書きました：

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() は新しい要素をリストに追加し、クリック ハンドラーをそれらにバインドします。クリックは要素の「アクティブ化」をトリガーします。問題は、並べ替えの後でもクリックイベントがトリガーされることです。確かにこれは望ましくありません!

追加関数の外で 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');
}

しかし、要素の外側のクリックをキャッチするためにイベントハンドラーをドキュメントにバインドしたいので、これはしたくありません。

何か案が？