0

真的一直试图弄清楚下面的代码中发生了什么......

function updateColourDropdown(url) {
    $("#selectList").unbind();
    $.post(setUniqueParam(url), $("#fruitForm").serialize(),
            function(data) {
                if (checkException(data)) {
                    $("#fruitDiv").children().each(function() {
                        removeElem(this);
                    }).end().html(data);
                    $("#selectList").change(function() {
                        updateColourDropdown($("#fruitColourView").val());
                    });
                    organiseAllocateTeams();
                }
                data = null;
            }
    );
    return false;
}

基本上有一个表格包含两个下拉列表,水果和颜色。如果用户更改了第一个选择列表中的水果,则调用服务器以找出可用的颜色以填充第二个选择列表。

我的 html 是使用 JSP 输出的 ..

selectList = id包含水果列表的选择列表,

fruitForm = id包含选择列表的表单

fruitDiv = id环绕我的两个选择列表的 div

fruitColourView = id用于链接到 struts 操作 ( xml )的隐藏输入字段

这是工作代码。我正在尝试在另一个页面上复制此代码,但是我发现它有点棘手,因为我不确定它实际上在做什么,以及为什么......据我所知,“数据”变量包含整个代码对于我的页面..

我已经在 jQuery 网站上查找了所有 .children .each .end 等,但我无法从逻辑上将它们放在一起......

谢谢堆,希望我已经足够清楚了。

4

1 回答 1

0
function updateColourDropdown(url) {
    // Remove handlers on #selectList
    $("#selectList").unbind();

    // Post to URL specified in the parameter, serializing #fruitForm
    $.post(setUniqueParam(url), $("#fruitForm").serialize(),

            // Run this on success
            function(data) {

                // Assuming `checkException` looks in the returned
                // data to see if something went wrong.
                if (checkException(data)) {

                    // Something went wrong; for each of #fruitDiv's children 
                    // run the function that removes that child element, then
                    // at the end, put the data, which appears to be HTML,
                    // into #fruitDiv
                    $("#fruitDiv").children().each(function() {
                        removeElem(this);
                    }).end().html(data);

                    // Then set a new `change` event handler on #selectList
                    // that runs `updateColourDropdown, given the value of
                    // #fruitColourView. See Note 1.
                    $("#selectList").change(function() {
                        updateColourDropdown($("#fruitColourView").val());
                    });

                    // Then call this.
                    organiseAllocateTeams();
                }

                // Useless.
                data = null;
            }
    );


    return false;
}

注意 1:在当前合理的 jQuery 版本中,我可能会使用一个使用事件委托的处理程序来处理这个问题,以避免重复解除绑定/重新绑定。

这个问题与 Struts 无关,也没有太多特别难以推理的事情。

于 2013-08-01T01:09:18.847 回答