2

Jeditable JQueryプラグインを使用して、リストをその場で編集します。これは、ページ上の既存のリストアイテムで正常に機能します。 

$('.edit').editable('http://localhost:8080/EditInPlace/Editable', {
    event     : "dblclick",
    callback : function(value, settings) {
        $(".dropdown dt a span").html(value);
        $("#result").html("Selected value is: " + getSelectedValue());
    }
});

ただし、ページにリストアイテムを動的に追加しているので、これらはイベントハンドラーに応答しません。クリックイベントに使用するのと同じように、委任されたイベントを使用する必要があると想定しています。 

$(document).on("click",".edit",function(e){
    alert("click!");
});

委任されたイベントにJeditableハンドラーを追加する方法がわかりません。助言がありますか？

4

1 に答える 1

3

委任メソッドはイベントを対象としています。カスタムイベントを作成することもできますが、今のところ簡単にするために、プラグインを必要とする新しい要素を追加するたびにプラグインを呼び出すだけです。

これは、ajax成功コールバック内、またはコード内append()またはhtml()コード内の任意の挿入メソッドを呼び出した後に発生する可能性があります。

コードをスリムに保つためにできることのいくつかは、プラグインのオプションオブジェクトを変数に格納して、毎回作成する必要がないようにすることや、多数のプラグイン呼び出しを含む関数を作成することです。

例：

var edit={ 
       url: 'http://localhost:8080/EditInPlace/Editable',
       opts:{
            event     : "dblclick",
            callback : function(value, settings) {
                 $(".dropdown dt a span").html(value);
                $("#result").html("Selected value is: " + getSelectedValue());
        }
    }
};

$(selector).append( newContentString).find('.editClass').pluginName(edit.url, edit.opts)
于 2012-06-19T16:18:45.577 に答える