0

この投稿のおかげで、ここにリンクの説明を入力してください。実際には機能していますが、HTMLドキュメントが直接書き込まれている場合に限ります。ただし、jqueryによって作成されたものと同じものをドキュメントに適用している間は機能しません。これを解決する方法を教えていただけますか？

私のコードは

<script>
var toggle = false;
$(function() {
    $('a.comments').click(function(e) {
        var $this = $(this);
        $('.toggleComments').toggle(1000,function() {
            if(!toggle) {
                $this.text('Hide Comments');
                toggle = !toggle;
            }else {
                $this.text('Show Comments');
                toggle = !toggle;
            }
        });
        e.preventDefault();
    });
}); 

var html;
$(document).ready(function()
{
html='<a href="#" class="comments">Show Comments</a><br /><div class="toggleComments">This is #comment1 <br />This is #comment2 <br /></div>';

$("#start").append(html);

}); 
</script>

</head>

<body>
<div id="start"></div>
</body>
</html>
4

3 に答える 3

1

問題は、イベントが存在する前にその要素にイベントをバインドしようとしていることです。クリックイベントをバインドしたときに要素が存在するように、コードを少し並べ替えるだけです。このjsFiddleページで動作していることがわかります。テキストには期待する動作がまったくないため、ロジックを少し再考することをお勧めします。

var html;
$(document).ready(function() {
    html = '<a href="#" class="comments">Show Comments</a><br /><div class="toggleComments">This is #comment1 <br />This is #comment2 <br /></div>';

    $("#start").append(html);
    var toggle = false;
    $('a.comments').click(function(e) {
        var $this = $(this);
        $('.toggleComments').toggle(1000, function() {
            if (toggle) {
                $this.text('Hide Comments');
            } else {
                $this.text('Show Comments');
            }
            toggle = !toggle;
        });
        e.preventDefault();
    });
});

この関数を使用して、on動的に追加された要素に自動的にバインドすることもできます。あなたがしなければならないのはに変更$("a.comments").click(function() {})することだけ$(document).on('click', 'a.comments', function() {})です。

于 2012-07-14T13:50:17.590 に答える
0

動的に作成された要素にイベントハンドラーを適用するには、 on関数が必要です。

 $(document).on('click', 'a.comments', function(e) {

提供された関数は、将来DOMに追加された要素でもクリックすると呼び出されます。

于 2012-07-14T13:47:11.120 に答える
0

.liveを使用して、このような問題を解決します

$('a.comments').live('click',function(){
 //do your job here
});
于 2012-07-14T13:47:19.997 に答える