Question

我正在尝试从webshop框架生成的输入字段中获取输入类型值。我不能改变HTML。当我添加字段时，它会创建：

<input id="filter_15" type="checkbox" name="filter[]" value="15">
<input id="filter_16" type="checkbox" name="filter[]" value="16">
<input id="filter_17" type="checkbox" name="filter[]" value="17">

我找到了一些基于输入id获取值的代码，除了id的filter _...可以更改，并且每个商店都有所不同。

任何吸烟？这是我到目前为止收集的内容。

<script type="text/javascript">
var filter;
function onload() {
    filter = document.getElementById('filter');
}
function show() {
    alert(filter.value);
}

Answer 1

您使用.getElementById走在正确的轨道上，但您需要.getElementsByName。

＆＃13;

var els = document.getElementsByName("filter[]");

for (var i = 0; i < els.length; i++)
  alert(els[i].value);

＆＃13;

<input id="filter_15" type="checkbox" name="filter[]" value="15">
<input id="filter_16" type="checkbox" name="filter[]" value="16">
<input id="filter_17" type="checkbox" name="filter[]" value="17">

＆＃13;

Answer 2

使用document.querySelectorAll，您可以使用任何CSS选择器，包括像"attribute starts with"这样的input[id^="filter_"]选择器，必须完成您的工作。

这是一个演示

＆＃13;

var inputs = document.querySelectorAll('input[id^="filter_"]');
debugger;
for (i = 0; i < inputs.length; i++) {
    alert(inputs[i].value)
}

＆＃13;

<input id="filter_15" type="checkbox" name="filter[]" value="15">
<input id="filter_16" type="checkbox" name="filter[]" value="16">
<input id="filter_17" type="checkbox" name="filter[]" value="17">

＆＃13;

Answer 3

您可以按标签名称获取输入，然后迭代它。

    var inputs, index, len;

    inputs = document.getElementsByTagName('input');
    len = inputs.length;

    for (index = 0; index < len; ++index) {
        alert(inputs[index].value)
    }

Answer 4

继承Jquery解决方案

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

对于每个输入类型使用javascript获取值

4 个答案: