1

「クローズ可能」というクラスがあり、それを既存の div に追加しようとしています。現時点では、完全に無視しているようです。:(

$(type).addClass('closable');
jQuery(form).append('<div class="'+type+'">'+data.msg+'</div>');

HTML 出力: 実際には表示されません。


私も試しました:

jQuery(form).append('<div class="'+ type +' closable">'+data.msg+'</div>');

HTML 出力:

<div class="warning closable">No data given</div>

これは、クラスを提供しているように見えますが、実際には関連する JS をトリガーしません。

これらのオプションはどちらも機能しません。

何か案は?

4

7 に答える 7

1

$(".element").on("click",function(){})動的に追加された要素で使用する必要があります

于 2013-08-20T10:26:16.883 に答える
1

私が理解したことから、それは動的要素とイベント処理の問題です。

コードjQuery(form).append('<div class="'+ type +' closable">'+data.msg+'</div>');は正常に見えますが、関連する js コードに問題があるようです

要素は動的に追加されるため、イベント委任ベースのイベント処理を使用する必要があります。

$('.closable').click(function(){
    //do something
})

あなたが必要

$(document).on('click', '.closable', function(){
    //do something
})
于 2013-08-20T10:28:44.140 に答える
0

typeあなたの場合、文字列ではなくHTML要素のjQueryオブジェクトです。
文字列変数を使用する場合は、それが 1 つであることを確認してください。

jQuery(function( $ ){ // DOM is now ready

    var type = 'warning'; // warning // success //
    var form = $('#form');
    var data = {msg:"hello!"};

    $(form).append('<div class="'+ type +'">'+ data.msg +'</div>');
    $('.'+ type).addClass('closable');

});

あなたの遅い編集について:

動的に生成された要素を扱うときは注意して、.on()メソッドhttp://api.jquerey/on/を使用してイベント リスナーをデリゲートします。

$('#nonDynamicParentEl').on('click', '.dynamicEl', fn);
于 2013-08-20T10:24:07.217 に答える
0

このようにしてみてください、

jQuery(function(){
    //other variables like form etc
    var type = 'warning';
    jQuery(form).append('<div class="'+type+'">'+data.msg+'</div>');

    // use . for class selectors and add below line after adding it in form
    jQuery('.'+type).addClass('closable');

    jQuery(document).on('click','.'+type,function(){
        //your code for type class
    });

});

動的に作成された要素を操作するには、on()を使用します

于 2013-08-20T10:26:28.467 に答える
0

type は、別の CSS クラスである 'success' または 'warning' として出力されます

typeそれが文字列であることを考えると、2 番目の例の内容は次のように機能します。

jQuery(form).append('<div class="' + type + '">' + data.msg + '</div>');

これは、クラスを提供しているように見えますが、実際には関連する JS をトリガーしません。

イベントが動的に追加された要素に関連付けられていないことを意味していると思います。これは、ページの読み込み時にイベントが添付されるためです。そのため、委任されたイベント ハンドラーを使用する必要があります。これを試して:

$(form).on('click', '.success', function() {
    // do something
});
于 2013-08-20T10:28:03.903 に答える
0

試す

jQuery(form)
    .append('<div>'+data.msg+'</div>')
    .children().last()
    .addClass('closable')
;

または、cars10 によるより単純なソリューションを使用します (現在はコメントにあります)。

于 2013-08-20T10:24:33.210 に答える