<html>
<body>
<input type="checkbox" name="checkboxName" onclick="buttonDisable"/>checkboxNameA <br/>
<input type="checkbox" name="checkboxName" />checkboxNameB <br/>
<input type="button" value="button" id="buttonNoDisable" disabled="disabled" />xxxxxx <br/>
</body>
<script type="text/javascript">
function buttonDisable(){
var checkbox = document.getElementsByName("checkboxName");
for(var i=0;i<checkbox.length;i++){
if (checkbox[i].checked) {
document.getElementById("buttonNoDisable").disabled=false;
return;
}else{
document.getElementById("buttonNoDisable").disabled=true;
}
}
}
function initPage(){
var checkbox = document.getElementsByName("checkboxName");
if (window.addEventListener) {//非IE,// 添加监听
for(var i=0;i<checkbox.length;i++){
checkbox[i].addEventListener('click',buttonDisable,false);
}
} else if (window.attachEvent){//IE
for(var i=0;i<checkbox.length;i++){
checkbox[i].attachEvent('onclick', buttonDisable);
}
}
}
initPage();
</script>
</html>
分享到:
相关推荐
1. **事件监听**:需要为下拉框或复选框添加事件监听器,如`change`事件,以便在用户做出选择时更新状态。 2. **DOM操作**:使用`document.createElement`、`appendChild`、`removeChild`等方法动态添加或删除选项。...
在JavaScript页面开发中,"左右添加...以上就是使用JavaScript创建"左右添加多选框"的基本步骤和原理,包括HTML结构、CSS布局以及JavaScript事件监听。根据实际需求,你可以进一步定制样式和交互,以实现更丰富的功能。
在JavaScript的世界里,复选框(checkbox)是网页交互中常见的元素,用户可以通过它们来选择一个或多个选项。本教程将深入讲解如何使用JavaScript实现复选框的全选和全不选功能,让您的网页交互体验更加友好。我们将...
总结,JavaScript复选框的相关函数涉及获取、设置状态、操作全选/全不选及事件处理等多个方面。理解并熟练运用这些函数,能帮助开发者创建更加动态和交互性强的Web页面。在实际应用中,我们还需要考虑兼容性、性能...
为了响应用户的操作,可以添加事件监听器,如`change`事件,以便在复选框状态改变时执行某些代码。 ```javascript checkbox.addEventListener('change', function() { console.log('Checkbox status changed!');...
在JavaScript和CSS的帮助下,我们可以创建功能丰富、样式美观的下拉多选框插件。本教程将深入探讨如何利用这两种技术来实现这样的功能。 首先,我们需要了解JavaScript的基础。JavaScript是一种客户端脚本语言,它...
这意味着开发者可以轻松地在不同位置添加多选框,而不用担心相互之间的冲突。此外,它还具备“打开多选框后选中原本已选的框”的特性,这意味着组件具有状态记忆功能,当用户重新打开多选框时,之前选定的选项会自动...
如果你想监听复选框状态的变化,可以添加`change`事件监听器: ```javascript checkbox.addEventListener('change', function() { if (this.checked) { console.log('Option selected'); } else { console.log...
2. **事件处理**:多选框的选中/取消选中会触发事件,开发者需要编写JavaScript代码来监听这些事件,更新数据模型并同步视图。同时,也需要处理父节点与子节点的联动逻辑,确保选中状态的一致性。 3. **DOM操作**:...
同时,可以通过自定义样式和事件处理,使多选框功能更加灵活。 在实际项目中,这些组件的运用往往涉及到数据遍历和动态样式赋值。例如,可以通过`v-for`指令遍历后台返回的数据,动态生成多选标签、按钮或框,并...
在Bootstrap中,下拉多选框是实现用户界面交互时常见的一种元素,尤其在数据筛选、选项选择等场景下非常实用。Bootstrap本身并没有内置专门的多选下拉框组件,但通过扩展或第三方插件,我们可以轻松地实现这一功能。...
// 将复选框添加到 div 容器中 myDiv.appendChild(oCheckbox); // 将文本节点添加到 div 容器中 myDiv.appendChild(myText); ``` 上述代码中,我们首先创建了一个文本节点 `myText`,接着获取了页面上 id 为 `...
本篇文章将详细探讨如何利用JSP和AJAX实现多选、全选、添加、删除以及更新多选框的功能。 一、JSP基础 JSP是一种基于Java的服务器端脚本语言,用于创建动态网页。开发者可以在HTML页面中嵌入Java代码,服务器会解析...
JavaScript插件可以丰富这种用户体验,通过添加动画效果和自定义样式,使复选框变得更加吸引人。 【描述】:“Javascript checkbox复选框动画插件特效源码.zip” 描述中的“Javascript checkbox复选框动画插件特效...
在本文中,我们将深入探讨如何使用jQuery和layui插件实现多选框的选择和美化特效,特别是在处理父级子级结构的权限选择场景中。jQuery是一个轻量级的JavaScript库,它简化了HTML文档遍历、事件处理、动画以及Ajax...
这段代码会在文档加载完成后,为所有`.exclusive`类的复选框添加事件监听器。当某个复选框被改变时,如果它被选中,那么所有其他复选框将被取消选中。 在实际项目中,我们可能还需要考虑更多的细节,比如防止用户...
本教程将详细介绍如何使用jQuery来实现一个功能丰富的下拉多选框。 首先,我们需要理解HTML的基本结构。一个基本的多选框在HTML中通过`<select>`元素定义,其`multiple`属性表示用户可以选中多个选项。例如: ```...
在JavaScript中,我们可以通过获取多选框的引用(例如,通过ID或类名),然后使用`checked`属性来检查或改变其选中状态。对于"控制显示和不显示列",这意味着多选框的状态会决定对应列是否在页面上可见。我们可以...
在IT领域,尤其是在前端开发中,我们经常遇到“多选框选到一定个数不能再选”的需求。这个功能主要用于限制用户在一组复选框(Checkbox)中最多只能选择固定数量的选项,通常用于实现权限控制、多选列表的限制等场景...