javascript 检查是否根据名称选中复选框

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/27195538/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-28 07:06:13  来源:igfitidea点击:

Check if Checkbox is checked based on name

javascriptjquerycheckboxdrop-down-menuselectedvalue

提问by user3837156

This is my code and it always returns "nothing is checked" no matter if something is checked or not.

这是我的代码,无论是否检查某些内容,它始终返回“未检查任何内容”。

function rstSelfs() {
var chkds = document.getElementsByName('selfs');
if(chkds.checked)? {
alert ("something is checked"); }
 else {
alert("nothing is checked");
}}

I have been using the above as a test to see if I can get the code to work properly. I have multiple checkboxes with the name "selfs" and I want the dropdown selection only to reset if none of the boxes with the name "selfs" are not checked. I would assume the code would look like this but nor this or the code above works... Please help.. I new to this and I have attempted to search and it is possible this has been answered but I apologize it did not name sent to me.

我一直在使用上述作为测试,看看我是否能让代码正常工作。我有多个名为“selfs”的复选框,我希望下拉选择仅在未选中任何名为“selfs”的框时重置。我会假设代码看起来像这样,但是这个或上面的代码也不起作用......请帮助..我是新手,我试图搜索,这可能已经得到回答,但我很抱歉它没有命名发送对我来说。

What I want the code to do is this:

我想让代码做的是:

function rstSelfs() {
var chkds = document.getElementsByName('selfs');
if(chkds.checked)? {
return false;  }
 else {
($('.CssSel').get(0).selectedIndex = 0) }
}



<form id="Service">
   <input type="checkbox" name="site" id="cktmcom" onclick="isTsite()">

    <input type="checkbox" name="selfs" id="ckselfc" onclick="isTsserv();isTextServC()">
    <label for="checkbox">Self-Serve Classic</label><br>
    <input type="checkbox" name="selfs" id="ckselfn" onclick="isTsserv();isTextServN()">
    <label for="checkbox">Self-Serve Next-Gen</label><br>
    <input type="checkbox" name="homeSer" id="ckhomes" onclick="isThs()">
    <label for="checkbox">Home Services</label><br>
    <input type="checkbox" name="mapp" id="ckmobilea" onclick="isTmApp()">
    <label for="checkbox">Mobile App</label><br>
    <input type="checkbox" name="checkbox" id="ckgem" onclick="isTextGem()">
    <label for="checkbox">Gemini</label><br>
</form>

<form id="Service2">
    <input type="checkbox" name="site" id="ckkmcom" onclick="isKsite()">
    <label for="checkbox">mobile.com</label><br>
    <input type="checkbox" name="selfs" id="ckKselfc" onClick="isKsserv();isKServC()">
    <label for="checkbox">M Self-Serve Classic</label><br>
    <input type="checkbox" name="selfs" id="ckKselfn" onClick="isKsserv();isKServN()">
    <label for="checkbox">M Self-Serve Next-Gen</label><br>
    <input type="checkbox" name="mapp" id="ckKmobilea" onclick="isKmApp()">
    <label for="checkbox">M Mobile App</label><br>
</form>

The checkboxes with name "selfs" control the hide and show for the div = selfserve. And I need to reset the drop down selection only if none of the "selfs" are chcked . I have actually have 5 checkboxes that have the name selfs. The code is rather large thats why the other 3 are missing.

名称为“selfs”的复选框控制 div = selfserve 的隐藏和显示。而且只有在没有检查任何“自我”时,我才需要重置下拉选择。我实际上有 5 个复选框,其名称为 selfs。代码相当大,这就是其他 3 个缺失的原因。

The HTML dropdown code is:

HTML 下拉代码是:

<div id="selfserve" style="display:none">
<select class="CssSel" style="width:175px" onChange="ssPicker()">
<option value="1" selected  style="color:red;" ssSel="**Self-Serve Issue**">Select Self-Serve        
Issue</option>
<option value="2" ssSel="Entire Site Down">Entire Site Down</option>
<option value="3" ssSel="Login Issues">Login Issues</option>
<option value="4" ssSel="Usage Meter Issue">Usage Meter Issue</option>
<option value="5" ssSel="Change feature Issues">Change feature Issues</option>
<option value="6" ssSel="Page Loading Issues">Page Loading Issues</option>
<option value="7" ssSel="Extreme Latency">Extreme Latency</option>
<option value="8" ssSel="Navigation Issues">Navigation Issues</option> 
</select>


</div>
 <input type="button" name="reset_self" value="Reset" onClick="rstSelfs()">

回答by Joce Pedno

Not working:

不工作:

Since you use jQuery, you can check if any checkboxes are not checked:

由于您使用 jQuery,您可以检查是否有任何复选框未被选中:

function rstSelfs() {
    var chkds = $("input[name='selfs']:checkbox");

    if (chks.not(":checked").length > 0)  {
        return false;  
    } else {
        ($('.CssSel').get(0).selectedIndex = 0) 
    }
}

this worked but I had to rework it a bit! thank you!

这行得通,但我不得不稍微修改一下!谢谢!

Tweaked, working:

调整,工作:

function rstSelfs() {
var chkds = $("input[name='selfs']:checkbox");

if (chkds.is(":checked"))  {
    return false;  
} else {
    ($('.CssSel').get(0).selectedIndex = 0) 
}
}

回答by Giedrius

getElementsByName()function returns an array of elements, not single element, so it doesn't have property checked. If there is only one element by this name you should use something like this:

getElementsByName()函数返回一个元素数组,而不是单个元素,所以它没有属性checked。如果这个名字只有一个元素,你应该使用这样的东西:

document.getElementsByName("selfs")[0].checked

Or to correct your function:

或者更正您的功能:

function rstSelfs() {
   var chkds = document.getElementsByName('selfs')[0];
   if(chkds.checked)  {
       alert ("something is checked"); }
   else {
       alert("nothing is checked");
}}

回答by Jitesh

Since you have more than one checkbox with same name , you will get array when you do document.getElementsByName('selfs') . Try looping through the resulting array to see if any of that is checked.

由于您有多个同名的复选框,当您执行 document.getElementsByName('selfs') 时,您将获得数组。尝试遍历结果数组以查看是否检查了其中的任何一个。

Something like this :-

像这样的东西:-

var isChecked=false ;

 for (i=0; i<document.Service.selfs.length;i++) {
if(document.Service.selfs[i].checked)

isChecked=true ;

}

 if(isChecked)  ($('.CssSel').get(0).selectedIndex = 0)