0

タブのjqueryコードを書いています。しかし、奇妙に見えるトラブルに遭遇しました。

私の知る限り、 Function on() はイベントを動的にバインドします。しかし、これは [a href] が新しく追加された後はそのようには機能しません。

誰かが問題の解決を手伝ってくれることを願っています。私の質問を見てくれてありがとう。

これは私が書いているコードです。

<script type="text/javascript">'
$(document).ready(function() {

$("#tab_pay a").on("click", function(event){

event.preventDefault();

var idx = $('#tab_pay li').index($(this).closest("li"));

var spanText = $("#tab_pay .tab_ov").find("span").text();

//Removing class and replacing with <a> tag.
$("#tab_pay .tab_ov").removeClass("tab_ov").find("span").replaceWith("<span><a href='#'>" + spanText + "</a></span>");

$(this).closest("ul").find("li:eq(" + idx + ")").addClass("tab_ov");

//Removing <a>
var aText = $(this).text();
$(this).replaceWith(aText);
});
});


<div id=tab_pay class="tab_pay">
<ul>
<li class="tab_ov"><span>1</span></li>
<li><span><a href="#">2</a></span></li>
<li><span><a href="#">3</a></span></li>
<li><span><a href="#">4</a></span></li>
</ul>
</div>
4

2 に答える 2

1

on呼び出しは動的にバインドされますが、呼び出されるオブジェクトは静的です。

代わりに親にバインドしたい

$("#tab_pay").on("click", "a", function(event){
    ...
} );
于 2013-02-15T09:18:19.033 に答える
0

イベントを変更しない親要素にバインドするか、.onの2番目の引数としてセレクターを文書化して使用します。

$(document).on("click", "#tab_pay a", function(event){
  // ...
});
于 2013-02-15T09:18:26.180 に答える