js初学—js全自定义单选框
代码如下:
<script type="text/javascript">
window.onload=function()
{
var oIput=document.getElementsByTagName('input');
var Obtn=document.getElementById('btn');
for(var i=;i<oIput.length;i++)
{
oIput[i].onclick=function()
{
for(var i=;i<oIput.length;i++)
{
oIput[i].checked=false;
}
this.checked=true;
}
}
btn.onclick=function()
{ alert('提交成功'); }
}
布局如下:
<p>1、这周星期天你干什么?</p>
<input type="radio" />看书
<input type="radio" />睡觉
<input type="radio" />吃饭
<input type="radio" />玩耍
<input type="radio" />洗衣服
<input type="radio" />听音乐</br>
<input type="button" value="提交" id="btn" />
总结:比较遗憾的是点击提交的时候没能选出后面的文字,比如:“提交成功,这周星期天你选择看书”!
js初学—js全自定义单选框的更多相关文章
- 自定义单选框radio样式
<!doctype html> <html> <head> <meta charset="utf-8"> <title> ...
- CSS学习笔记三:自定义单选框,复选框,开关
一点一点学习CCS,这次学习了如何自定义单选框,复选框以及开关. 一.单选框 1.先写好body里面的样式,先写几个框 <body> <div class="radio-1 ...
- vue.单选和多选,纯css自定义单选框样式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- CSS魔法堂:改变单选框颜色就这么吹毛求疵!
前言 是否曾经被业务提出"能改改这个单选框的颜色吧!让它和主题颜色搭配一下吧!",然后苦于原生不支持换颜色,最后被迫自己手撸一个凑合使用.若抛开input[type=radio] ...
- js自定义修改复选框单选框样式,清除复选框单选框默认样式
之前做项目的时候,也遇到过需要按照设计稿把<input type="checkbox">和<input type="radio">的默认 ...
- 关于如何用js完成全选反选框等内容
在学习js过程中按照视频写了这个页面 可以在点上面全选/全不选时全部选中或者取消 在单击下面的单选框时上面的全选会根据下面的单选框进行相应的调整 功能比较完善 以下是代码 <!DOCTYPE h ...
- 关于通过jq /js 实现验证单选框 复选框是否都有被选中
今天项目中遇到一个问题 就是要实现,单选框,复选框 同时都被选中才能进行下一步的问题,开始用js原生来写 怎么写都觉得不合适,通过for循环得出 复选框被选中的,在通过for循环得出单选框被选中的,问 ...
- 怎么用js代码改变单选框的选中状态
今天突然有一个需求要用到,使用js代码改变单选框的选中状态.当时想也不想直接 function doGender(gender) { if (gender == "男") { ge ...
- JS实现单选按钮回显时页面效果出现,但选中单选框的值为空
最近做了很多前端页面的工作,遇到的一个感觉很头疼的问题在这里记一下: 经常用JS回显单选框,但是明明从页面效果上来看,单选框已经被选中了,可是却不能触发单选框的change事件,取值的时候用某种方法取 ...
随机推荐
- Linux配置无线网卡驱动实现无线上网
本机装Linux,需要配置的无线驱动.一般Ubuntu都集成无线驱动,基本上无线可以直接使用! 01.查看无线网卡的型号 [root@Mr-zhao software]# lspci | gre ...
- 【JavaEE企业应用实战学习记录】struts2登录
<%-- login.jsp Created by IntelliJ IDEA. User: Administrator Date: 2016/10/6 Time: 16:26 To chang ...
- 配置163Yum源自动判断你的系统是Centos版本(适用于5.x或6.x)
#!/bin/bash #Author:nulige #Date: 2015-3-8 #实现功能:自动判断你的系统是Centos版本,适用于5.x或6.x mv /etc/yum.repos.d/Ce ...
- Hadoop配置安装手册
本次Hadoop集群安装一共使用四个节点,各节点IP如下: Master 172.22.120.191 Slave1 172.22.120.192 Slave2 172.22.120.193 Slav ...
- git工作流程
git工作流程 一般工作流程如下: 克隆 Git 资源作为工作目录. 在克隆的资源上添加或修改文件. 如果其他人修改了,你可以更新资源. 在提交前查看修改. 提交修改. 在修改完成后,如果发现错误,可 ...
- android 监听短信并发送到服务器
1. 接受系统的短信广播,操作短信内容. 优点:操作方便,适合简单的短信应用. 缺点:来信会在状态栏显示通知信息. 2. 应用观察者模式,监听短信数据库,操作短信内容. 实例如下: SystemE ...
- iOS开发小技巧--即时通讯项目:消息发送框(UITextView)高度的变化; 以及UITextView光标复位的小技巧
1.即时通讯项目中输入框(UITextView)跟随输入文字的增多,高度变化的实现 最主要的方法就是监听UITextView的文字变化的方法- (void)textViewDidChange:(UIT ...
- fatal: Not a valid object name: 'master'.
fatal: Not a valid object name: 'master'. the answer is : That is again correct behaviour. Until you ...
- 状态压缩 HDU 3091
多组数据 n个点m条边 求有几个经过所有的点的环 最好用__int64 #include<stdio.h> #include<algorithm> #include<st ...
- 51nod 1076强连通
Tarjan算法来解这题.无向图可以转化为有向图来解决. #include<map> #include<queue> #include<stack> #includ ...