Question

我有一个名称为过滤器的对象，当范围滑块更改时，我想更改该对象内的数量

我的HTML代码是：

<input id="length" class="border-0" type="range" min="1" max="100"/>

和我的jQuery：

function updateData() {
    var filter = {};
    filter.length = $('#length').val();
    return filter;
}

$('#length, #height, #capacity').change(function () {
   updateData();
   console.log(updateData())
});

下面的代码不起作用，并返回1-100之间的数字

Answer 1

这应该工作-我对您的代码进行了一些重构，并将过滤器添加到外部范围，以便您可以根据不同类型更新对象。现在，Updatedata需要一个类型和一个值，并根据目标设置对象键和值。

var filter = { length:0, height:0, capacity:0 };
function updateData(id, value) {
    filter[id] = value;
    return filter;
}

$('#length, #height, #capacity').change(function (e) {
    console.log( updateData(e.target.id, e.target.value) );
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<label for="length">Length</label>
<input id="length" class="border-0" type="range" min="1" max="100"/>
<label for="height">Height</label>
<input id="height" class="border-0" type="range" min="1" max="100"/>
<label for="capacity">Capicity</label>
<input id="capacity" class="border-0" type="range" min="1" max="100"/>

如果您想要“实时”值，请参见以下Codepen示例：https://codepen.io/juanbrujo/pen/uIqaw

Answer 2

尝试以下方法：

filter["length"] = $('#length').val();

这消除了您设置实际的length属性的机会-但是您必须像IIRC这样访问该属性：

filter["length"]

IMO，更改属性名称会更容易，但是我尝试使其尽可能与您的代码相似。

使用onchange jQuery

2 个答案: