Question

我是JavaScript的新手。

我有一个网页，用户可以搜索文档ID并将其添加到他们的收藏夹中。提交搜索条件后，它会显示一个列表ID和旁边的复选框。因此用户可以选中或取消选中该复选框以将其添加到列表中或从列表中删除。

我的问题是我的代码无法获取所生成复选框的值。例如，生成了三个复选框chk1，chk2，chk3。当没有一个被选中时，我的代码正在运行，我可以获得复选框的值。但是例如当其中之一被选中时，chk3被选中，而当我检查chk1时，它仍然显示chk3的值而不是chk1。我想获取刚刚选中的复选框的值。我努力使事情变得正确。

  <tr><%do until results_rs.EOF%>
   <td class="tdid"><%Response.Write results_rs("id")%></td> 
   <td><input type="checkbox" id="myCheckbox" name ="myf[]" value="<%=results_rs("id")%>" onchange="myfc()">
   <script>

     function myfc(){
     var selchb = getSelectedChbox(this.form);
     alert(selchb)
     }


     function getSelectedChbox(frm) {
         var selchbox = null;
           var chk_arr=document.getElementsByName("myf[]")
           var chklength=chk_arr.length

           for (k = 0; k < chklength; k++) {
               if (chk_arr[k].checked == true)
                 selchbox=chk_arr[k].value
               }
             return selchbox

       **strong text**// rs.close;
       // connection.close
       } 

</script></td>
    <%results_rs.MoveNext%>
    </tr>

Answer 1

最小的更改是将this传递到myfc：

onchange="myfc(this)"

...然后在myfc中使用它：

 function myfc(cb){
    alert(cb.value);
 }

但是您可能会使用addEventListener等来研究更现代的事件。

请注意，无需在复选框上放置id，实际上，具有相同的id的多个复选框是无效的，因此最好删除{{ 1}}部分。

Answer 2

JS中的

ID必须唯一。使用课程class="myCheckbox"

那你就可以做

window.addEventListener("load",function() {
  var checks = document.querySelectorAll(".myCheckbox");
  for (var i=0;i<checks.length;i++) { // all .myCheckbox
    checks[i].addEventListener("click",function() {
      console.log(this.checked,this.value); // this specific box
      var checks = document.querySelectorAll(".myCheckbox:checked");
      for (var i=0;i<checks.length;i++) { // all CHECKED .myCheckbox
        console.log(checks[i].value); // only checked checkboxes are shown
      }
    });
  }
});

以您的情况为例

window.addEventListener("load",function() {
  var checks = document.querySelectorAll(".myCheckbox");
  for (var i=0;i<checks.length;i++) { // all .myCheckbox
    checks[i].addEventListener("click",function() {
      if (this.checked) myfc(this.value); // this specific box
    });
  }
});

如何使用javascript动态获取选中复选框的值

2 个答案: