0

私はAJAX経由でフォームをロードしています...私は勝利のjQueryステートメントであると思っていたものを持っていますが、何もしません:

$("#input_form_container").loadActionTemplate()
                          .find ('.form-focus:first').focus();

loadActionTemplate は、フォームをロードするために作成した関数です。フォームをロードしてから、「this」への参照を返すため、チェーンを続行できます。ターゲット要素は、次のようなテキスト入力フィールドです。

<input class="span1 form-focus" id="min-duration" name="min-duration" size="16" type="text">

ノート：

  • ロード後にデバッガーに入ると、このスクリプトを実行し (したがって、テンプレートがロードされた後)、「jQuery("#input_form_container").find ('.form-focus:first').focus();」を実行します。デバッガーからは、フィールドを強調表示し、将来の連鎖のためにDOM参照を返すことで、魔法のように機能します

  • 私が入力した場合：

    jQuery("#input_form_container").loadActionTemplate().find ('.form-focus:first').focus();

    デバッガーに直接入力すると、テンプレートが再読み込みされ、正しい DOM 要素への参照が返されますが、フォーカスが得られません。

  • 必死になって、focus() 呼び出しの前に delay(500) を挿入しようとしましたが、それは必要ではなく、とにかく問題を解決しませんでした。

どんな助けでも大歓迎です。

4

1 に答える 1

1

@Andreas が指摘しているように、AJAX は -- 結局 -- 非同期です。私は自分が何らかの方法で構築した jQuery チェーンが AJAX コールバックの success() 条件でのみ起動すると信じ込ませていました。睡眠不足、高品質のカフェインおよび/またはアンフェタミンへのアクセスの欠如のみを指摘できると私が思った理由. とにかく、解決策を共有しようとして、ここに私の「loadActionTemplate」jQuery拡張があります：

$.fn.extend({
    // loadActionTemplate plugin
    loadActionTemplate: function(options) {
        //default settings
        var defaults = {
            actionDOM : '#do_something_dropdown',
            cache : true
        }
        // store the "this" state for safe keeping
        var domElements = $(this);
        // merge user options into default
        var options = $.extend(defaults, options);
        // assign the "action" to an easily addressible variable
        var action = $(options.actionDOM).val();
        // get the HTML form template for this action
        LG_ServiceCall ( 'get-action-template' , {'action' : action} , function( r ) {
            var res = JSON.parse ( r );
            var template = res.results.template;
            // iterate through all matched DOM instances
            return domElements.each(function() {
                // get handle on DOM object operating on
                var element = $(this);
                element.html( template );
                element.find('.form-focus:first').focus();
            })
        });
        return domElements; // allows the function to operate in a chain
    }
});

面倒な詳細は省きますが、LG_ServiceCall メソッドは次の 3 つのパラメーターを使用します。

function LG_ServiceCall( $service , $options , $callback );

3 番目のパラメーターに渡されたコールバック関数は、AJAX.success() メソッドが呼び出されたときに呼び出されます。

requestObj.success = function (r) {
    console.log ("Successful AJAX Call ( " + JSON.stringify (r) + ")");
    callback (r);
}
于 2012-10-01T22:47:55.187 に答える