2

reddit投稿のレポートボタンにあるものと同様に、リンクの「Areyousure」確認を作成しようとしています。クリックすると、リンクは「Are you sure Yes / No」というテキストに置き換えられます。ここで、「yes」はアクションを実行し、「no」はリンクを復元します。リンクを確認に置き換えることはできますが、確認を非表示にするための「いいえ」リンクを取得できません。

関連するコード:

<span id="confirm"><a href="#>Confirm</a></span>


<script type="text/javascript">
$(function() {

   $("#confirm").click(function() {
     $(this).html('Are you sure? <a href="#">Yes</a> / <a id="unconfirm" href="#">No</a>');
   });

   $("#unconfirm").click(function() {
     $(this).parents("span").html('<a href="#">Confirm</a>');
   });

 });
</script>
4

2 に答える 2

5

#unconfirmイベントバインディングが実行された時点では、要素はDOMに存在していません。イベントハンドラーをDOMツリーのさらに上に委任する必要があります。

$(document).on("click", "#unconfirm", function() {
    $(this).parents("span").html('<a href="#">Confirm</a>');
});

これは.on()、イベントハンドラーを選択された要素()にバインドするメソッドを使用しますが、イベントdocumentが2番目の引数()に一致する要素で発生した場合にのみハンドラー関数を実行します#unconfirm

.on()これはjQuery1.7で追加されたことに注意してください。古いバージョンで立ち往生している場合は、.delegate()代わりに使用できます。

また、他の祖先要素に置き換える方が効率的であることに注意してくださいdocument(それ以降、委任されたイベントハンドラーがトリガーされるまで、イベントの移動距離が短くなります)。

于 2012-09-09T08:48:45.837 に答える
1

要素は動的に生成されるため、委任を使用してイベントをアタッチする#unconfirm必要があります。on()

$(closestStaticParent).on('click', '#unconfirm', function() { ... })
于 2012-09-09T08:49:27.243 に答える