jQuery HOW TO?将其他参数传递给$ .ajax调用的成功回调? [英] jQuery HOW TO?? pass additional parameters to success callback for $.ajax call?

问题描述

我正在尝试能够将附加参数传递回我为成功的Ajax调用创建的成功回调方法，但徒劳无功.一点背景.我有一个页面，其中包含许多动态创建的文本框/选择框对.每对具有动态分配的唯一名称，例如name ="unique-pair-1_txt-url"和name ="unique-pair-1_selectBox"，那么第二对具有相同的名称，但前缀不同.

I am trying, in vain it seems, to be able to pass additional parameters back to the success callback method that I have created for a successful ajax call. A little background. I have a page with a number of dynamically created textbox / selectbox pairs. Each pair having a dynamically assigned unique name such as name="unique-pair-1_txt-url" and name="unique-pair-1_selectBox" then the second pair has the same but the prefix is different.

为了重用代码，我精心设计了回调以获取数据和对selectbox的引用.但是，当回调被触发时，对选择框的引用将返回为未定义".我在此处读到它应该是可行的.我什至尝试利用'context'选项，但还是一无所获.这是我要使用的脚本块:

In an effort to reuse code, I have crafted the callback to take the data and a reference to the selectbox. However when the callback is fired the reference to the selectbox comes back as 'undefined'. I read here that it should be doable. I have even tried taking advantage of the 'context' option but still nothing. Here is the script block that I am trying to use:

<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>

从我读到的内容来看，我觉得自己很亲近，但是我不能将手指放在丢失的链接上.请以典型的忍者隐身方式提供帮助. TIA

From what I have read, I feel I am close but I just cant put my finger on the missing link. Please help in your typical ninja stealthy ways. TIA

****更新**** 尼克是真正的忍者.他们应该为此发明一个新的徽章！他的回答如下.正如他所提到的，它是1.4特定的，但我可以接受.这是我的最终代码，适用于所有受过训练的忍者(以及我将来的参考资料):

****UPDATE**** Nick is a true Ninja. They should invent a new badge for that! His answer below does the trick. As he mentions it's 1.4 specific but I can live with that. Here is my final code that is working for any Ninjas in training (and my future reference):

<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>

推荐答案

已更新:如果您使用的是jQuery 1.4，请使用它来简化一些操作:

Updated: If you're using jQuery 1.4 use this to simplify things a bit:

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)

这篇关于jQuery HOW TO?将其他参数传递给$ .ajax调用的成功回调?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！