Question

我是jQuery的新手，我遇到了一个很容易被大多数前端大师发现的问题。

我创建了以下脚本

$(document).ready(function() {
    $("#facet_properties input[type='checkbox']").each(function() {
        $(this).click(function() {
            var queryString = getQueryString();
            $('body').load(window.location.pathname.concat(queryString));
        })
    });
});

function getQueryString() {
    var queryString = "";
    var queryStringBegun = false;
    $("#facet_properties input[type='checkbox']").each(function() {
        if ($(this).is(':checked')) {
            var checkboxFullName = $(this).attr('name');
            var checkboxName = checkboxFullName.substr(checkboxFullName.lastIndexOf('_') + 1);
            var concatenationCharacter = '&';
            if (!queryStringBegun) {
                concatenationCharacter = '?';
            }
            queryString.concat(concatenationCharacter).concat(checkboxName);
            queryStringBegun = true;
        }
    });

    return queryString;
}

我正在尝试在getQueryString方法中创建一个查询字符串变量，但不知何故queryString保持为空。当选中复选框时，我看到语句queryString.concat（concatenationCharacter）.concat（checkboxName）;到达，我看到'concetenationCharacter'和'checkboxName'具有正确的值。那么为什么我的函数返回“”？

这可能是一个变量范围问题。我猜它很简单。谢谢！

Answer 1

concat()不会改变原始字符串。您必须将返回值分配回变量：queryString = queryString.concat(concatenationCharacter).concat(checkboxName);

使用concat()有点过分，你可以简单地用+运算符连接字符串：

queryString += concatenationCharacter + checkboxName;

与问题无关，但您可以通过将.is(':checked')检查从函数移动到选择器来缩短您的代码：

$("#facet_properties input[type='checkbox']:checked").each(function() {
    ...

您也无需单独将click事件附加到每个元素。您可以再次使用选择器。在事件中使用变量也有点不必要（除非你在实际的应用程序中有更多的用途）。

$(document).ready(function() {
    $("#facet_properties input[type='checkbox']").click(function() {
        $('body').load(window.location.pathname + getQueryString() );
    });
});

Answer 2

concat（）返回一个值....

收集这个价值...... 第queryString.concat(concatenationCharacter).concat(checkboxName);行

应该是这样的

queryString = queryString.concat(concatenationCharacter).concat(checkboxName);

Answer 3

我没有测试过，但我想我会做类似

的事情

$(document).ready(function() {
    $("#facet_properties input[type='checkbox']").each(function() {
        $(this).click(function() {
            var checkboxFullName = $(this).attr('name');
            var checkboxName = checkboxFullName.substr(checkboxFullName.lastIndexOf('_') + 1);
            var concatenationCharacter = '&';
            if (!queryStringBegun) {
                concatenationCharacter = '?';
            }
            var queryString.concat(concatenationCharacter).concat(checkboxName);
            $('body').load(window.location.pathname.concat(queryString));
        })
    });
});

正如我所说，我还没有测试过它

为什么我的jQuery变量为空？

3 个答案: