Question

下面是一个函数，用于循环一系列具有特定id属性的输入滑块并捕获它们的值。这是行不通的。为什么哦'为什么？谢谢。

JS小提琴示例

HTML

<button id='button'>save</button>

<input id="pitchInput_1" type='range'></input>

<input id="pitchInput_2" type='range'></input>

JAVASCRIPT

 $('#button').click(function(){

     $('input[id^="pitchInput_"]').each(function(){
           alert(this.id);
           alert($('input[id^="pitchInput_"]').val()); // Doesn't capture correct val of BOTH sliders. 

        });


    });

Answer 1

是的，val()只获得第一个。

var values = $('input[id^="pitchInput_"]').map(function() {
    return $(this).val();
});
alert(values.join('\n'));

此处，values是滑块值的数组。

Answer 2

对您的代码进行一些修改将为您提供帮助。

<input id="pitchInput_1" type='range'></input>

<input id="pitchInput_2" type='range'></input>

现在每个循环都会评估滑块的正确值。

$('#button').click(function(){

 $('input[type="range"]').each(function(){
     alert(this.id);
     alert($(this).val()); 
  });
});

请在此处查看DEMO。

除此之外，您只需修改此行即可获得适当的值。

alert($('input[id^="pitchInput_"]').val());

这个。

alert($(this).val());

希望它有所帮助。

如何遍历DOM中的输入范围滑块列表并使用每个循环捕获值

2 个答案: