в jQuery как?? передайте дополнительные параметры для обратного вызова success для $.AJAX-вызов?

Я тщетно пытаюсь передать дополнительные параметры обратно методу обратного вызова success, который я создал для успешного вызова ajax. Небольшое отступление. У меня есть страница с несколькими динамически созданными парами textbox / selectbox. Каждая пара, имеющая динамически назначенное уникальное имя, такое как name="unique-pair-1_txt-url" и name="unique-pair-1_selectBox", то вторая пара имеет то же самое, но префикс отличается.

в попытке повторного использования код, я создал обратный вызов, чтобы взять данные и ссылку на selectbox. Однако при запуске обратного вызова ссылка на selectbox возвращается как "undefined". Я читаю здесь что это должно быть выполнимо. Я даже попытался воспользоваться опцией "контекст", но все равно ничего. Вот блок скрипта, который я пытаюсь использовать:

<script type="text/javascript" language="javascript">
$j = jQuery.noConflict();
function getImages(urlValue, selectBox) {
    $j.ajax({
        type: "GET",
        url: $j(urlValue).val(),
        dataType: "jsonp",
        context: selectBox,
        success:function(data){
         loadImagesInSelect(data)
        } ,
        error:function (xhr, ajaxOptions, thrownError) {
            alert(xhr.status);
            alert(thrownError);
        }

    });
}

function loadImagesInSelect(data) {
var select = $j(this);
select.empty();
$j(data).each(function() {
    var theValue = $j(this)[0]["@value"];
    var theId = $j(this)[0]["@name"];
    select.append("<option value='" + theId + "'>" + theValue + "</option>");
});
select.children(":first").attr("selected", true);

}    
</script>

из того, что я прочитал, я чувствую, что я близок, но я просто не могу положить палец на недостающее звено. Пожалуйста, помогите ваши типичные ниндзя украдкой пути. ТИА!--3-->

****обновление**** Ник-настоящий ниндзя. Они должны изобрести для этого новый значок! Его ответ ниже делает трюк. Как он упоминает это 1.4, но я могу жить с этим. Вот мой окончательный код, который работает для любых ниндзя в обучении (и моя будущая ссылка):

<script type="text/javascript" language="javascript">
$j = jQuery.noConflict();
function getImages(urlValue, selectBox) {
    $j.ajax({
        type: "GET",
        url: urlValue+ '?callback=?',
        dataType: "jsonp",
        context: selectBox,
        success: jQuery.proxy(function (data) {
            var select = $j(this);
            select.empty();
            $j(data).each(function() {
                var theValue = $j(this)[0]["@value"];
                var theId = $j(this)[0]["@name"];
                select.append("<option value='" + theId + "'>" + theValue + "</option>");
            });
            select.children(":first").attr("selected", true);
        }, selectBox),
        error:function (xhr, ajaxOptions, thrownError) {
            alert(xhr.status);
            alert(thrownError);
        }
    });
}
</script>

5 ответов


обновление: Если вы используете jQuery 1.4, используйте это, чтобы немного упростить:

success: jQuery.proxy(function (data) {
    var select = $j(this);
    select.empty();
    $j(data).each(function() {
        var theValue = $j(this)[0]["@value"];
        var theId = $j(this)[0]["@name"];
        select.append("<option value='" + theId + "'>" + theValue + "</option>");
    });
    select.children(":first").attr("selected", true);
}, selectBox)

Это то, что я сделал, и он работал штрафа:

$.ajax('URL', {
    myCustomControl: selectBox,
    myCustomVariable: 'teste',
    data:
    {
       myData: 1
    },
    success: function (data, textStats, jqXHR) {
        myFunction(data, textStats, jqXHR, this.myCustomControl, this.myCustomVariable);
    }   
});

вы можете добавить элементы управления и переменные в параметры вызова ajax.


положите это в свой $.параметры Аякса.

invokedata: {
    data1: "yourdata",
    data2: "moredata"
}

в функции успеха используйте его следующим образом

this.invokedata.data1;
this.invokedata.data2;

ваши $.вызов ajax и функция успеха также должны быть частью одного и того же объекта. Поместите свои функции в объект и определите их следующим образом

function myObject {
    var getImage = function(..) { }
    var loadImagesInSelect = function(..) { }
}

this выходит за рамки

просто так вы(или кто-нибудь еще) понимаете (ы)1, почему this была определена в loadImagesInSelect() в вашем исходном примере было потому, что эта функция находилась в другой области, и области не "каскадируют", как это2.

когда вы указали "контекст"selectBox в вашем вызове AJAX он устанавливает контекст (this) для функций, заданных для "успеха"и " ошибки". (Так уж случилось, что они оба были анонимными функциями.) В этот момент this определяется в обеих этих функциях как значение selectBox. Теперь в функции, переданной в "success", вы вызываете loadImagesInSelect(). При вызове функции создается новая область. В этом объеме, this будет window в нестрогом режиме и undefined в строгом режиме.


поставить графически (в строгом режиме3):

// this = window (global scope)

$j = jQuery.noConflict();
function getImages(urlValue, selectBox) {

    // this = undefined (function scope level 1)

    $j.ajax({
        type: "GET",
        url: $j(urlValue).val(),
        dataType: "jsonp",
        context: selectBox,
        success: function(data) {

            // this = selectBox (function scope level 2)

            loadImagesInSelect(data);
        },
        error: function(xhr, ajaxOptions, thrownError) {

            // this = selectBox (function scope level 2)

            alert(xhr.status);
            alert(thrownError);
        }
    });
}

function loadImagesInSelect(data) {

    // this = undefined (function scope level 3)

    var select = $j(this);
    select.empty();
    $j(data).each(function() {
        var theValue = $j(this)[0]["@value"];
        var theId = $j(this)[0]["@name"];
        select.append("<option value='" + theId + "'>" + theValue + "</option>");
    });
    select.children(":first").attr("selected", true);
}

$.proxy() избыточна

использование $.proxy() в обновленном коде является избыточным. Вы используете $.proxy() и this к функции, которая ранее называлась loadImagesInSelect(), но вы все равно переместили эту функцию в "успех" (вместо того, чтобы вызывать ее изнутри "успех"). Он уже имеет доступ к значению this указано в "context".

убрать $.proxy() обертка вокруг вашей функции "успех" в вашем обновленном коде, и она все равно будет работать.

я знаю, что это было годы с тех пор, как вы задали свой вопрос, но я надеюсь, что это поможет.


  1. я надеюсь, что это не покажется снисходительным; это не должно быть.
  2. по крайней мере, не тогда, когда вы вызов функция, а не с контекста. Если вы определяете функцию внутри функции (т. е. закрытие), то любые переменные во внешней функции будут доступны во внутренней функции. , контекст внешней функции (тега this переменной) еще недоступна во внутренней функции.
  3. заменить undefined С window для нестрогого режима.
  4. или уроженца Function.prototype.bind() в ECMAScript 5.

можно использовать indexValue атрибут для прохождения :

var someData = "hello";

jQuery.ajax({
    url: "http://maps.google.com/maps/api/js?v=3",
    indexValue: {param1:someData, param2:"Other data 2", param3: "Other data 3"},
    dataType: "script"
}).done(function() {
    console.log(this.indexValue.param1);
    console.log(this.indexValue.param2);
    console.log(this.indexValue.param3);
});