2

jQuery In Place Editorをいじってみましたが、適切に無効にする方法がわかりません。以下は私がこれまでに持っているコードです。

toggleリンクのリストでプラグイン機能を初期化および終了するためにjQueryメソッドを使用しています。以下のコードには、おそらく私の問題とは関係のない余分なビットがいくつかありますが、念のために残しておきます。

問題は、以下のコードが最初の2クリックで期待どおりに機能することです（つまり、1回目のクリック-editInPlaceプラグインを有効にし、2回目のクリック-無効にします）が、3回目のクリックでインプレース編集機能を再度有効にしません。

なぜ何かアイデアはありますか？

(shoppingList.editButton).toggle(function() {
            (shoppingList.editButton).attr('value', 'Finish editing');
            (shoppingList.$ingrLinks).unbind('click', shoppingList.ingredients) // disable some functionality on links
                                     .addClass('inplace-editor') // add class to links I want to be editable
                                     .removeAttr('href') // make links unclickable
                                     .editInPlace({ // editInPlace plugin initialized
                                         url: 'http://localhost:8000/edit-ingredient/',
                                         show_buttons: true
                                     });

        }, function() {
            (shoppingList.editButton).attr('value', 'Edit items');
            (shoppingList.$ingrLinks).bind('click', shoppingList.ingredients) // bring back the functionality previously removed
                                     .removeClass('inplace-editor') // remove the class from links that were editable
                                     .attr('href', '#') // make the links clickable again
                                     .unbind('.editInPlace') // remove editInPlace plugin functionality
                                     ;
        });
4

3 に答える 3

0

トグルに渡される最初の関数は、ユーザーがクリックするたびに実行されます。

于 2012-11-13T21:41:36.387 に答える
0

リンクをリンクのクローンに置き換えます。引数falseを指定して使用$.clone()すると、すべてのイベントハンドラーがクローンから削除されます。

2番目の関数（1番目の関数はそのままにします）：

 function() {
            (shoppingList.editButton).attr('value', 'Edit items');
              //close the editor(s) when still active
            $('.inplace_cancel',shoppingList.$ingrLinks).trigger('click');
              //create clones of the items
            var clones=(shoppingList.$ingrLinks).clone(false)
                        .each(function(i,o) {
                          //restore the original behaviour
                            $(o)//o is a clone 
                              .bind('click', shoppingList.ingredients) 
                              .removeClass('inplace-editor') 
                              .attr('href', '#')
                                //replace the link inside the document with it's clone
                              .replaceAll($(shoppingList.$ingrLinks[i]));            
            });
            //assign the clones to shoppingList.$ingrLinks
            shoppingList.$ingrLinks=clones;
        }
于 2012-11-13T23:17:20.910 に答える
-2

うまくいく解決策を見つけました：

$('input[name="edit-items"]').toggle(function() {
    $(this).attr('value', 'Finish editing');
    (shoppingList.$ingrLinks).unbind('click', shoppingList.ingredients) // disable highlighting items
                             .removeAttr('href');
    $('.editme').editable("enable");
    $('.editme').editable('http://localhost:8000/edit-ingredient/');
}, function() {
    $(this).attr('value', 'Edit item');
    (shoppingList.$ingrLinks).attr('href', '#');
    $('.editme').editable("disable");
    (shoppingList.$ingrLinks).bind('click', shoppingList.ingredients) // re-enable highlighting items

});
于 2012-11-14T21:03:34.280 に答える