//**********************radio
<!--
window.onload = function(){
var inputs = document.getElementsByTagName("INPUT");
for(var e in inputs){
if(inputs[e].type == "radio"){
inputs[e].onclick = function(){
for(var e in inputs){
//两种写法都可以,第一种采用的是正则表达式,效率相对第二种较底,但是未改变HTML标准比第二种容//易理解
//if(inputs[e].type == "radio" && this.name.replace(/\d+/g,"") === //inputs[e].name.replace(/\d+/g,""))
if(inputs[e].type == "radio" && this.group === inputs[e].group)
inputs[e].checked = false;
}
this.checked = true;
};
}
}
}
<form>
<input type="radio" name="a0" group="a"/>a0<input type="radio" name="a1" group="a">a1
<br/>
<input type="radio" name="b0"/>b0<input type="radio" name="b1">b1
</form>
两个radio的名称可以不同,但前名的字前面的要一样,后面的数字不一样
//******************Checkbox
window.onload = function(){
var inputs = document.getElementsByTagName("INPUT");
for(var e in inputs){
if(inputs[e].type == "checkbox"){
inputs[e].onclick = function(){
for(var e in inputs){
//两种写法都可以,第一种采用的是正则表达式,效率相对第二种较底,但是未改变HTML标准比第二种容//易理解,第二种兼容性不好
if(inputs[e].type == "checkbox" && this.name.replace(/\d+/g,"") === inputs[e].name.replace(/\d+/g,""))
//if(inputs[e].type == "checkbox" && this.group === inputs[e].group)
inputs[e].checked = false;
}
this.checked = true;
};
}
}
}
<form>
<input type="checkbox" name="RPT_ROAD_A2__APPROVAL_PASS_1" />aaa
<input type="checkbox" name="RPT_ROAD_A2__APPROVAL_PASS_2" />bbb
</form>
两个checkbox的名称可以不同,但前名的字前面的要一样,后面的数字不一样
分享到:
相关推荐
1. **Radio(单选)功能**:在 zTree 中启用 Radio 功能,用户只能选择一个节点,类似于传统的单选按钮。这种模式适用于需要用户做出唯一选择的场景,例如地区选择、等级划分等。 2. **Checkbox(复选)功能**:复...
在MFC中,为了保持代码的可读性和复用性,我们可以创建一个基类,比如CTransparentCtrl,然后让Radio、CheckBox和Static控件的类继承自这个基类,这样就可以在基类中统一处理透明逻辑。 总的来说,实现透明的Radio...
2. **创建样式化容器**:在原生控件旁边创建一个可定制样式的元素,如`<label>`或`<span>`,并利用CSS3选择器关联这两个元素。 ```css input[type="radio"] { display: none; } label { display: inline-...
在网页设计中,Radio(单选按钮)和Checkbox(复选框)是常见的表单元素,用于用户选择或提供选项。这些元素虽然功能强大,但默认样式通常较为简单,可能不符合现代网页的审美需求。因此,为了提升用户体验和界面...
Radio按钮用于在多个选项中选择一个,而checkbox则允许用户选择多个选项。它们的默认样式通常是浏览器决定的,但通过CSS和JavaScript可以改变其外观和行为。 在jQuery中,我们可以使用`.addClass()`和`.removeClass...
2. **创建自定义样式**:然后,我们可以创建一个伪元素(如`::before`或`::after`)来模拟radio或checkbox的外观。 ```css label::before { content: ""; display: inline-block; width: 20px; height: 20px; ...
在网页设计中,radio(单选按钮)和checkbox(复选框)是常见的表单元素,用于收集用户的选择信息。然而,原生的HTML radio和checkbox样式通常较为简单,不符合现代网页美观的需求。jQuery,一个广泛使用的...
`checkbox` 和 `radio` 可能会被组织在不同的表单或列表中,通过 CSS 布局技术(如 Flexbox 或 Grid)来控制它们的位置和对齐方式。 总结,实现“好看的”`checkbox` 和 `radio` 样式涉及 HTML 结构的设定、CSS ...
而radio则是单选按钮,用户只能选择其中一个选项。 在jQuery中,操作这些元素通常涉及到选择它们,改变它们的状态,以及响应用户的交互。以下是一些常见的jQuery操作: 1. **选择元素**:jQuery提供了多种选择器,...
这个"Radio/Checkbox Style"项目可能有一个活跃的GitHub仓库,用户可以在那里找到项目的源码、示例、文档,甚至可以提交自己的改进或修复。开发者可以通过参与社区讨论,获得关于如何集成到自己的项目中的指导,或者...
Checkbox是用户界面中常见的一个组件,允许用户从多个选项中选择一个或多个。默认情况下,用户可以无限制地选择Checkbox,但根据业务需求,我们可能需要限制用户只能选择固定数量的选项。 实现这个功能有多种方法,...
这意味着用户只能选择其中的一个选项。 - `name` 属性是关键,它将多个`radio`按钮关联在一起,确保同一组内的选项互斥。 - `value` 属性定义了每个选项的值,这将在提交表单时发送到服务器。 - 使用 `checked` ...
Radio和checkbox通常用于用户进行单选或多选操作,而select则用于下拉列表选择。在默认情况下,这些元素的样式受到浏览器的限制,往往显得单调且不一致。LazyForm允许开发者通过CSS和JavaScript来定制这些元素的外观...
Radio控件是单选按钮,用户只能选择其中的一个。在Windows API中,Radio控件默认是不透明的。要实现透明背景,可以采用类似Static控件的方法,即自定义控件的绘图过程,忽略背景填充,只绘制按钮的图形元素,如圆圈...
"漂亮的Checkbox Radio漂亮样式"这个主题,主要关注如何通过CSS(Cascading Style Sheets)和其他前端技术来美化这两种控件,使其更具吸引力并符合现代网页设计的标准。 首先,让我们了解一下Checkbox和Radio的基本...
每个样式对应的css,html,js 文件都有,享用直接套就可以
- **定义**:`checkbox`用于让用户从多个选项中选择一个或多个。默认情况下,`checkbox`不被选中。 - **HTML语法**:`<input type="checkbox" id="checkboxId" name="groupName" value="value">` - **属性**:`id...
在Android开发中,Radio和Checkbox是两种常用的UI组件,它们分别用于实现单选和多选功能。本示例源码提供了在Android应用中如何有效利用这两种控件的实践案例。 RadioGroup与RadioButton RadioGroup是Android中管理...
Radio按钮通常用于提供一组互斥的选择,用户只能选择其中一个。在jQuery中,我们可以使用`.prop()`或`.attr()`方法来改变其选中状态,使用`.val()`获取选中的Radio的值。 1. **设置Radio选中状态**: ```...
综上所述,"jQuery radio checkbox美化"涉及到前端开发中的多方面技能,包括jQuery的选择器和事件处理、CSS样式设计、插件应用、自定义图标、响应式设计以及无障碍性考虑。通过学习和实践这些技巧,可以创建出既美观...