Question

//initial  code   

var selectInputs = document.querySelectorAll('option:checked');
    var selectArray=[];                        
      for(var i=0;i<selectInputs.length;i++)
          {
            selectArray[i]=selectInputs[i].value;//am doing this since I found out (from stackoverflow) that selectInputs contains a NodeList and in order to use it, it must be converted or saved as an array
          }

     //later stage manipulation code

var input_select=  document.querySelectorAll('option:checked');
for(var i=0;i<input_select.length;i++)
{
input_select[i].value=selectArray[i];//I am trying to change the value of the <select> option
}

目的：用户选择表单中的选项，数据保存在本地存储中。我想在表单重新加载时反映相同的内容。我不是为一个特定的表单工作所以使用Jquery似乎是徒劳的（因为它适用于类或id，我不知道通用表单的任何标记的id或类）

问题：问题是我想选择标签的整个选项集，而不仅仅是已经检查/选择的选项。上面的代码将默认选择的选项的值设置为存储在本地存储中的选项，但不反映更改在形式。它总是显示默认值，但给出

alert(input_select[i].value);

完美地反映了内部变化！

Answer 1

猜猜我要回答我自己的问题:-D

如果你能看到，

中只有一个愚蠢的变化

//后期阶段操作代码上方。

解答：

var input_select=  document.querySelectorAll('select');
for(var i=0;i<input_select.length;i++)
{
input_select[i].value=selectArray[i];//I am trying to change the value of the <select> option
}

而不是

var input_select=  document.querySelectorAll('option:checked');

一定是

var input_select=  document.querySelectorAll('select');

原因：我一直试图将存储的值分配给选项本身（选项标签）而不是整个选择标签。

警告：在代码中

input_select[i].value=selectArray[i];

也可能是

input_select[i].value="Friday";

如果您已经有这样的选项，那么它会显示空白。

<select name="days" id=days">
<option value="0"> Friday </option>
<option value="1"> Monday </option>
</select>

works

<select name="days" id=days">
<option value="0"> Saturday </option>
<option value="1"> Monday </option>
</select>

doesn't work. Shows a blank.

如何使用queryselectorAll（）？</select>选择包含已检查和未选中选项的<select>标记

1 个答案: