代码如下:

<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全自定义单选框的更多相关文章

  1. 自定义单选框radio样式

    <!doctype html> <html> <head> <meta charset="utf-8"> <title> ...

  2. CSS学习笔记三:自定义单选框,复选框,开关

    一点一点学习CCS,这次学习了如何自定义单选框,复选框以及开关. 一.单选框 1.先写好body里面的样式,先写几个框 <body> <div class="radio-1 ...

  3. vue.单选和多选,纯css自定义单选框样式

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  4. CSS魔法堂:改变单选框颜色就这么吹毛求疵!

    前言  是否曾经被业务提出"能改改这个单选框的颜色吧!让它和主题颜色搭配一下吧!",然后苦于原生不支持换颜色,最后被迫自己手撸一个凑合使用.若抛开input[type=radio] ...

  5. js自定义修改复选框单选框样式,清除复选框单选框默认样式

    之前做项目的时候,也遇到过需要按照设计稿把<input type="checkbox">和<input type="radio">的默认 ...

  6. 关于如何用js完成全选反选框等内容

    在学习js过程中按照视频写了这个页面 可以在点上面全选/全不选时全部选中或者取消 在单击下面的单选框时上面的全选会根据下面的单选框进行相应的调整 功能比较完善 以下是代码 <!DOCTYPE h ...

  7. 关于通过jq /js 实现验证单选框 复选框是否都有被选中

    今天项目中遇到一个问题 就是要实现,单选框,复选框 同时都被选中才能进行下一步的问题,开始用js原生来写 怎么写都觉得不合适,通过for循环得出 复选框被选中的,在通过for循环得出单选框被选中的,问 ...

  8. 怎么用js代码改变单选框的选中状态

    今天突然有一个需求要用到,使用js代码改变单选框的选中状态.当时想也不想直接 function doGender(gender) { if (gender == "男") { ge ...

  9. JS实现单选按钮回显时页面效果出现,但选中单选框的值为空

    最近做了很多前端页面的工作,遇到的一个感觉很头疼的问题在这里记一下: 经常用JS回显单选框,但是明明从页面效果上来看,单选框已经被选中了,可是却不能触发单选框的change事件,取值的时候用某种方法取 ...

随机推荐

  1. 玩转WIN7的MKLINK

    引言: 换了新电脑,终于再次使用上啦WIN7 ,经过一个周每天重装N次系统,终于弄好一个像样的系统啦.由于使用rt7lite对WIN7SP1官方整合包进行了适当精简,所以最终系统的稳定性还得经过一段时 ...

  2. js 基础(一)

    <!--最近需要用到js相关的知识 就把在W3cSchool 下学到的东西做个笔记,方便以后再看 --><!DOCTYPE html> <html> <hea ...

  3. openldap+phpadmin的搭建安装

    1.概念介绍 LDAP是轻量目录访问协议,英文全称是Lightweight Directory Access Protocol,一般都简称为LDAP.它是基于X.500标准的,但是简单多了并且可以根据 ...

  4. [转]oracle设计数据库应选择正确的数据类型

    原文地址:http://blog.sina.com.cn/s/blog_5014663501007n40.html 在设计数据库的时候,选择正确的数据类型,往往可以避免很多的问题,正确理解数据库的类型 ...

  5. 【POJ 2406】Power Strings 连续重复子串

    看的<后缀数组——处理字符串的有力工具>这篇论文,在那里这道题是用后缀数组实现的,复杂度为$O(nlogn)$,很明显长度为$2×10^6$的数据会TLE,所以必需得用复杂度为$O(n)$ ...

  6. E(X+Y), E(XY), D(X + Y)

    \(X, Y\)为两个随机变量, \(p_X(x), p_Y(y)\)分别为\(X, Y\)的概率密度/质量函数, \(p(x, y)\)为它们的联合概率密度. \(E(X + Y) = E(X) + ...

  7. editplus-查找替换的正则表达式应用

    editplus查找替换的正则表达式应用 表达式 说明 \t 制表符. \n 新行. . 匹配任意字符. | 匹配表达式左边和右边的字符. 例如, "ab|bc" 匹配 " ...

  8. dede使用方法---如何添加视频

    根据客户的需求,需要上传客户自己的视频,但是发现一个视频就有一百多M,想到数据库总共可容纳的才一百多M,于是想到利用其他专业的视频网站,再嵌入到自己的网站里面. 我在这里选的是爱奇艺,下面总结一下主要 ...

  9. 管道命令和xargs的区别(经典解释)

    一直弄不懂,管道不就是把前一个命令的结果作为参数给下一个命令吗,那在 | 后面加不加xargs有什么区别 NewUserFF 写道: 懒蜗牛Gentoo 写道: 管道是实现"将前面的标准输出 ...

  10. bzoj2938: [Poi2000]病毒

    建AC自动机,把所有病毒的节点都删掉,dfs判有没有环,有环就找得到. #include <iostream> #include <cstdio> #include <c ...