Question

我必须在（a）之前基于另一个选择框填充一个选择框（b），我为此使用了更改事件，但是更改事件保持触发，第二个选择框继续填充自己，这样我不是能够在第二个选择框中选择一个项目，因为无论我选择什么它重新填充自己，我看到在b中选择的第一个条目。

$(document).ready(function () {
    $("*:first").change(function () {
        var b = document.forms[0].b;
        var a = document.forms[0].a.value;

        if (a != "") {
            var value = "";
            var par = 'c=' + a;

            $.ajax({
                url: "compute",
                data: par,
                type: "post",
                dataType: "text",
                async: false,
                success: function (data) {
                    value = JSON.decode(data);
                }
            });

            var options = "";

            for (k in value) {
                options = options + "<option value='" + value[k] + "'>" + k + "</option>" + "\n";
            }

            b.innerHTML = options;
        } else {
            b.innerHTML = '<option value="">-Select-</option>';
        }
    });
});

Answer 1

问题：您是正确的:first将匹配的设置减少为仅第一项;但*匹配所有内容，因此*:first实际上是在选择<html>元素（或您的案例中的其他顶级元素）。 .change()不适用于该元素，因此其默认行为未定义 - 但由于更改事件冒泡直到<select>元素中的顶级元素，似乎每次都会触发它们。

解决方案：将处理程序绑定到正确的元素。另外，请不要发出请求async: false，因为这会导致浏览器挂起，直到服务器响应。相反，将其他代码移动到成功回调中：

$(document).ready(function() {
    var b = $('select:last');
    $("select:first").change(function() {
        var $this = $(this);
        var a = $this.val();

        if (a) {
            var par = 'c=' + a;
            $.ajax({
                url: "compute",
                data: par,
                type: "post",
                dataType: "text",
                //async: false,
                success: function(data) {
                    var value = JSON.decode(data);
                    var options = "";
                    for (k in value)
                        options += "<option value='" + value[k] + "'>" + k + "</option>";

                    b.html(options);
                }
            });
        }
        else {
            b.html('<option value="">-Select-</option>');
        }
    });
});

jquery更改事件继续触发

1 个答案: