Question

我有这个：

var category = "3%2C16%2C6%2C10%2C1%2C19";

女巫类别ID中的

是3 16 6 10 1 19，%2C是类别之间的空格。

我想要的是：

if (document.getElementById("3").checked = false) {
    category = "16%2C6%2C10%2C1%2C19";
}
else {
    category = "3%2C16%2C6%2C10%2C1%2C19";
}

我想为我拥有的所有复选框设置此功能，但您无法取消选中所有复选框，因为服务器不会向您发送任何数据。

这是用于过滤结果

Answer 1

尝试

if (document.getElementById("3").checked === false) {

注意额外的双等于进行类型安全检查

或更好

if (!document.getElementById("3").checked) {

然而，当你正在使用jQuery时，你似乎正在将一个字符串从检查状态混合在一起，这对于硬编码的字符串来说真的很脆弱，所以可能是这样的：

var category = "";

$( "input:checked" ).each(function() {
    category = $(this).id + "%2C";
};

仅在需要输出时调用，例如按下按钮。

Answer 2

当您使用jquery时，您可以收听change事件以获取复选框，然后在每次选中或取消选中一个列表时构建列表。要存储值，您可以使用复选框的value属性或添加data-属性。

获取值数组并join可以避免尾随%2C。

var category = '';
(function($) {
    // cache collection of checkboxes
    var cboxes = $('input[type=checkbox]');

    cboxes.on('change', function() {
        // find the ticked boxes only, and make an array of their category values, then join the values by a space
        category = $.makeArray(cboxes.filter(':checked').map(function() {
            return $(this).data('category');
            //return $(this).val(); // if you store them in value="3"
        })).join('%2C');
        
        // output for debug purpose
        $('#categoryOutput').html("'" + category + "'");
    });
})(jQuery);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

<form>
    <input type="checkbox" id="c1" data-category="3" />
    <input type="checkbox" id="c2" data-category="16" />
    <input type="checkbox" id="c3" data-category="6" />
    <input type="checkbox" id="c4" data-category="10" />
    <input type="checkbox" id="c5" data-category="1" />
    <input type="checkbox" id="c6" data-category="19" />
</form>
<div id="categoryOutput"></div>

附注：尽量避免使用数字启动元素id - 它在技术上无效，并且在某些情况下可能会破坏。

Answer 3

使用数组会更容易，然后在需要时将其转换为此字符串表示。

var categories = [];
$('#category-form input').change(function () {
    var id = $(this).attr('data-id'),
        index = categories.indexOf(id);
    if (this.checked && index === -1) {
        categories.push(id);
    } else if (!this.checked && index !== -1) {
        categories.splice(index, 1); 
    }
});

您可以在this fiddle中查看我的工作代码。（带有多个复选框，字符串表示和至少一个检查）

javascript修改变量

3 个答案: