7

ここで少し問題があります。フォームをロードして DOM に割り当てるには、$.post() を含むイベントをトリガーする必要があります。これが完了したら、フォームのフィールドを編集しました。

私は試した：

$.when(function(){
    $('#type_rank_field').trigger('change'); //calls the $.post() to load the form
})
 .done(function(){
    $('#quest_'+questions[i].split('|')[1]).children('option[value="'+questions[i].split('|')[0]+'"]').attr('selected',true);
});

残念ながら、これは機能しません。そのままにしておくと、次のようになります。

$('#type_rank_field').trigger('change');
$('#quest_'+questions[i].split('|')[1]).children('option[value="'+questions[i].split('|')[0]+'"]').attr('selected',true);

変更は次のようになります。

        $('#type_rank_field').live('change',function(){
        var id = $(this).children('option:selected').attr('id');
        var id_edited = get_id_from_id(id);
        $.post('ajax/load_questions_of_rank.ajax.php',{id: id_edited},function(data){
            //alert(data);
            $('#rank_fields').html(data);
        });
    });

次に、フォームが適切にロードされて DOM にアタッチされる前に、フォームの編集が実行されます。これは JavaScript の人にとってはばかげた質問かもしれませんが、私は主に PHP の人なので、残酷なことはしないでください :-)

ありがとう

4

4 に答える 4

8

changeハンドラー コードを分離できますか? このようなもの：

$('#type_rank_field').on('change',function(){
    handleChange($(this));
});

function handleChange(elem, callback) {
    var id = elem.children('option:selected').attr('id');
    var id_edited = get_id_from_id(id);
    $.post('ajax/load_questions_of_rank.ajax.php',{id: id_edited},function(data){
        //alert(data);
        $('#rank_fields').html(data);
        if (typeof callback === "function") {
            callback(data);
        }
    });
};

次に、トリガーする代わりに、AJAX 呼び出しが完了したときに実行するコールバックを渡すchangeだけで呼び出すことができます。handleChange

handleChange($("#type_rank_field"), function(data) {
    $('#quest_'+questions[i].split('|')[1])
        .children('option[value="'+questions[i].split('|')[0]+'"]')
        .attr('selected',true);
});
于 2013-02-05T16:43:51.117 に答える
7

イベントハンドラからpromiseオブジェクトを返します。

$(document).on('change','#type_rank_field',function(){
    var id = $(this).children('option:selected').attr('id');
    var id_edited = get_id_from_id(id);
    return $.post('ajax/load_questions_of_rank.ajax.php',{id: id_edited},function(data){
        //alert(data);
        $('#rank_fields').html(data);
    });
});

triggerHandler()代わりに使用してください。

var promise = $('#type_rank_field').triggerHandler('change');
promise && promise.done(function(){
    // do stuff
});

使用されている機能を示す簡単な例を次に示します。http：//jsfiddle.net/WQPXt/

于 2013-02-05T16:48:29.490 に答える
2

投稿後にコールバックを追加する必要があると思います

$('#type_rank_field').on('change', function(ev, cb){
    var id = $(this).children('option:selected').attr('id');
    var id_edited = get_id_from_id(id);
    $.post('ajax/load_questions_of_rank.ajax.php',{id: id_edited},function(data){
        //alert(data);
        $('#rank_fields').html(data);
        // add after callback to make sure that html is inserted
        if(typeof cb == "function"){
           cb.apply($(this)) // this apply with the jq object context or another context u want
        }
 });

トリガーの変更は次のようになります

$('#type_rank_field').trigger('change', [function(){
  $('#quest_'+questions[i].split('|')[1]).children('option[value="'+questions[i].split('|')[0]+'"]').attr('selected',true);
}]);
于 2013-02-05T16:56:52.367 に答える
-3

.livev1.7 から jQuery で廃止され、v1.9 で削除されました。

に置き換える必要があり.on()ます。

.onバインディング要素には 2 つの署名がありますが、.live1 つしかありません。

バインド時に要素が存在する場合は、次のようにします。

$('.element').on('click', function(){
  .......
});

省略形を使用することもできます：

$('.element').click(function(){
  .........
});

要素がその時点で存在しない場合、または新しい要素が追加される場合 (これは.live通常使用されていたものです)、「イベント委任」を使用する必要があります。

$(document).on('click', '.element', function(){
  ........
});

注: 常にではなく、最も近い静的要素にバインドする必要がありますdocument。

それまでの間、jQuery を最新バージョンにアップグレードすると、jQuery Migrate プラグインを使用して機能を復元できます。.live()

于 2013-02-05T16:38:05.797 に答える