4

クリックするとクラスが変更される単純なボタンがあります。そのクラスが再度クリックされたことを検出しようとする 2 つ目のスクリプトがあります。

クリックしてオン/オフできる必要があります。

//// [アーカイブ] ボタンをクリックしても機能する //// [アーカイブ解除] ボタンをクリックしても機能しない

Jクエリ1.9

//// Archive button clicked
$('a.archive_butt').on("click", function() {

    //// Put the li in as an object
    var li = $(this).parent('li');
    var entry_id = $(li).attr('rel');

    //// Add class to the li            
    $(li).addClass('status_archived');

    //// Swap the Archive button for unarchive
    $(this).addClass('unarchive_butt');
    $(this).removeClass('archive_butt');
    $(this).empty();
    $(this).text('Un-Archive');

    return false;
});



//// Un Archive button clicked
$('a.unarchive_butt').on("click", function() {
    alert('Fire');  
    return false;
});
4

4 に答える 4

1

を呼び出すとクリックイベントがバインドされますが、呼び出したとき.onにクラスを持つ要素がunarchive_butt存在しないため、バインドされません。

あなたが本当に必要としている.live()のは、以下のコードを支持して廃止された古い jQuery 機能です。

$('body').on('click', 'a.archive_butt', function() {
    //do stuff
});

$('body').on('click', 'a.unarchive_butt', function() {
    //do stuff
});
于 2013-03-27T21:42:09.767 に答える
0

変化する

$('a.unarchive_butt').on("click", function() {

に

$('a.unarchive_butt').live("click", function() {
于 2013-03-27T22:18:43.437 に答える
0

この.live()メソッドは 1.7 で廃止されたため、使用しないでください。

jQuery.on()

jQuery 1.7 以降、.on()メソッドは、イベント ハンドラーをアタッチするために必要なすべての機能を提供します。
...
.on( events [, selector ] [, data ], handler(eventObject) )
...が省略されているか null の場合、イベント ハンドラーは
directまたは direct - boundと呼ばれます。 ...が指定されている 場合、イベント ハンドラはdelegatedと呼ばれます。 ...委任イベントには、後でドキュメントに追加される子孫要素からのイベントを処理できるという利点があります。selector

selector

したがって、置き換えてみてください：

$('a.unarchive_butt').on("click", function() {
    ...
});

と

$().on("click", "a.unarchive_butt", function() {
    ...
});

これにより、直接バインドされたイベントが委任されたイベントに変わり、後でクラスの変更や dom に追加されたオブジェクトを処理できるようになります。

于 2013-03-27T22:29:38.530 に答える
0

個人的には、次のようにします。

    //// Archive button clicked
$('a.button').on("click", function() {        
    if ($(this).hasClass("archive_butt")){
       $(this).text('Un-Archive');
       //and all other stuff you are doing
    } 
    else{
       $(this).text('Archive');
       //and all the other stuff you are doing...
    }    
    $(this).toggleClass("unarchive_butt").toggleClass("archive_butt");
});

http://jsfiddle.net/7n5tz/

于 2013-03-27T21:49:30.620 に答える