如何切换 selected true 或 false onchange select 标签？

Question

我有一个带有 n 个选项的 select 标签。我需要将 selected 选项设置为 true，并将其他选项设置为 false。 true 应该在 onchange 函数触发时切换。

我的代码如下：

let techDropClone = document.getElementsByTagName("select")[0];
let opt = techDropClone.options;
opt[techDropClone.selectedIndex].setAttribute("selected",true);

我知道上面的代码不会触发 true 但我不知道如何实现。

Answer 1

$('button').on('click', function() { var chbx = $('input[type=checkbox]');$.each(chbx, 函数(索引, 值) {console.log(value.id+':'+value.checked);});});

Answer 2

普通 js 解决方案可以是：

let techDropClone = document.getElementsByTagName("select")[0];
let opt = techDropClone.options;

for(var i=0; i<opt.length; i++){
    if(i == techDropClone.selectedIndex){
        opt[i].setAttribute("selected",true);
    }else{
        opt[i].setAttribute("selected",false);
    }
}

可以进行优化，但我对你的数据结构还不够了解

Answer 3

您可以尝试以下方式：

function myfunc(el){
  document.querySelectorAll('select option').forEach(function(op){
    op.removeAttribute("selected");
  });
  let techDropClone = el;
  let opt = techDropClone.options;
  opt[techDropClone.selectedIndex].setAttribute("selected", true);
}

myfunc(document.querySelector('select'));

<select onchange="myfunc(this)">
  <option value="volvo">Volvo</option>
  <option value="saab">Saab</option>
  <option value="mercedes">Mercedes</option>
  <option value="audi">Audi</option>
</select>

如何切换 selected true 或 false onchange select 标签？

How to toggle selected true or false onchange of select tag?

html

javascript

dom

html-select