JavaScript JavaScript对checkbox的校验

来源:互联网 发布:淘宝福利搜索关键词 编辑:程序博客网 时间:2024/06/18 14:36

下面展示下利用 JavaScript 对 checkbox 中某一项是否被选中进行校验, 若没有校验 ,给予提示信息。


实现的效果:



checkbox部分的校验代码:


页面代码 checkbox部分:

              <div class="row-modal" style="text-align:center;"><div class="control-group-modal" style="margin:0 auto;"><label class="control-label" for="noticeToEndList">终端:</label><div class="controls"><form:checkbox path="noticeToEndList" value="1" />移动端<form:checkbox path="noticeToEndList" value="2" />PC端<form:checkbox path="noticeToEndList" value="3" />设备端<font class="red">*</font></div></div></div>



Js代码

//新增修改时候的校验function validate(){var result = true;result =  validateNoticeToEndList();return result;}function validateNoticeToEndList(){//判断是否是第一次添加提示信息var checkbox = document.getElementsByName("noticeToEndList");for(var i=0; i<checkbox.length; i++){if(checkbox[i].checked && checkbox[i].value!=""){return true;}else{continue;}}console.log("验证未通过");if(document.getElementById("noticeToEndListTips")==null){var tips = document.createElement("font");tips.id = "noticeToEndListTips";tips.style.color = "red";tips.innerHTML = "请选择要发布的设备端";checkbox[checkbox.length-1].parentNode.appendChild(tips);}return false;}



0 0