質問
...少なくとも私には。このコード 使用済み うまくいくために。何も変わっていないと確信していますが、今では突然奇妙に振る舞います。基本的に、インラインの編集機能を作成しようとしています。ユーザーがリンクをクリックすると、テキストボックスと確認とキャンセルのリンクを動的に生成します。セル内のすべてを削除しないキャンセルリンクに問題があります。
HTML:
...
<td class="bid">
<a href="javascript:" class="102093" title="Click to modify bid">$0.45</a>
</td>
...
バインディングJQuery(in $(function())
):
$('.bid a').live('click', renderBidChange);
....
$('.report_table .cancel').live('click', cancelUpdate);
renderBidChange
(この関数は動的要素を作成します):
function renderBidChange(){
var cpc = $(this);
var value = cpc.text().replace('$', '');
var cell = cpc.parent('.bid');
cpc.hide();
var input = document.createElement('input');
$(input).attr({type:'text',class:'dynamic cpc-input'}).val(value);
cell.append(input);
var accept = document.createElement('a');
$(accept).addClass('accept').attr({'href':'javascript:',
'title':'Accept Changes'}).text('Accept Changes');
cell.append(accept);
var cancel = document.createElement('a');
$(cancel).addClass('cancel').attr({'href':'javascript:',
'title':'Cancel Changes'}).text('Cancel Changes');
cell.append(cancel);
$(input).focus();
input.select();
}
cancelUpdate
この関数は、セルの目に見えるすべて(この場合のすべての動的なジャンク)を削除し、そこにあったものを示します。
function cancelUpdate(){
var cell = $(this).parent();
cell.find(':visible').remove();
cell.find(':hidden').show();
}
ただし、何らかの理由で、キャンセルリンクがクリックされた後も残ります!それ以外は他のすべてが削除されます。 WTF
提供できる洞察をありがとう!私が(カフェインで)見ているのはちょうど愚かな小さな細部だと確信しています...
アップデート これを投稿した直後に、私はそれがCSSの問題である可能性があるとepphanしましたが、私のコードを二重にチェックした後、そうではありません。
解決
ここでわずかな調整が必要です:
$('.bid a:not(.cancel)').live('click', renderBidChange);
あなたが引っ越してから .live()
, 、最初の関数もCANCELをクリックして実行されています:)
他のヒント
変更した場合はどうなりますか:
$('.report_table .cancel').live('click', cancelUpdate);
に
$('.bid .cancel').live('click', cancelUpdate);
私は解決策を期待していませんが、私はただダブルチェックしています
.acceptの「ライブ」関数は何ですか?それは機能しますか(おそらくそうです)
所属していません StackOverflow