精华内容
下载资源
问答
  • 主要介绍了js简单获取表单中单选按钮值的方法,涉及javascript针对form表单元素的遍历与查找相关操作技巧,需要的朋友可以参考下
  • 本文实例讲述了js简单获取表单中单选按钮值的方法。分享给大家供大家参考,具体如下:HTML部分如下:bordercolor="#999999">回退类型:type="radio" name="returnTag" value="-1" checked="checked">申报部门...

    本文实例讲述了js简单获取表单中单选按钮值的方法。分享给大家供大家参考,具体如下:

    HTML部分如下:

    bordercolor="#999999">回退类型:

    type="radio" name="returnTag" value="-1" checked="checked">

    申报部门

    type="radio" name="returnTag" value="1"> 省网招标中心

    type="radio" name="returnTag" value="2"> 国网招标中心

    JS代码如下:

    function getValue()

    {

    //获取单选按钮值

    for(var i=0;i

    {

    if(form1.returnTag[i].checked)

    {

    var returnTagValue=form1.returnTag[i].value; //这里得到单选按钮值

    }

    }

    }

    希望本文所述对大家JavaScript程序设计有所帮助。

    展开全文
  • [Java教程]表单中单选、多选、选择框值的获取及表单的序列化0 2015-12-17 13:00:11总结了下在表单处理中单选、多选、选择框值的获取及表单的序列化,写成了一个对象。如下:1 var formUtil = { 2 // 获取单选按钮的...

    [Java教程]表单中单选、多选、选择框值的获取及表单的序列化

    0 2015-12-17 13:00:11

    总结了下在表单处理中单选、多选、选择框值的获取及表单的序列化,写成了一个对象。如下:1   var formUtil = { 2 // 获取单选按钮的值,如有没有选的话返回null 3 // elements为radio类的集合的引用 4 getRadioValue:function(elements) { 5 var value = null; // null表示没有选中项 6 // 非IE浏览器 7 if(elements.value != undefined && elements.value != '') { 8 value = elements.value; 9 } else { 10 // IE浏览器 11 for(var i = 0, len = elements.length; i < len; i++ ) { 12 if(elements[i].checked) { 13 value = elements[i].value; 14 break; 15 } 16 } 17 } 18 return value; 19 }, 20 21 // 获取多选按钮的值,如有没有选的话返回null 22 // elements为checkbox类型的input集合的引用 23 getCheckboxValue:function(elements) { 24 var arr = new Array(); 25 for(var i = 0, len = elements.length; i < len; i++ ) { 26 if(elements[i].checked) { 27 arr.push(elements[i].value); 28 } 29 } 30 if(arr.length > 0) { 31 return arr.join(','); 32 } else { 33 return null; // null表示没有选中项 34 } 35 }, 36 37 // 获取下拉框的值 38 // element为select元素的引用 39 getSelectValue:function(element) { 40 if(element.selectedIndex == -1) { 41 return null; // 没有选中的项时返回null 42 }; 43 if(element.multiple) { 44 // 多项选择 45 var arr = new Array(), options = element.options; 46 for(var i = 0, len = options.length; i < len; i++) { 47 if(options[i].selected) { 48 arr.push(options[i].value); 49 } 50 } 51 return arr.join(","); 52 }else{ 53 // 单项选择 54 return element.options[element.selectedIndex].value; 55 } 56 }, 57 58 // 序列化 59 // form为form元素的引用 60 serialize:function(form) { 61 var arr = new Array(), 62 elements = form.elements, 63 checkboxName = null; 64 for(var i = 0, len = elements.length; i < len; i++ ) { 65 field = elements[i]; 66 // 不发送禁用的表单字段 67 if(field.disabled) { 68 continue; 69 } 70 switch (field.type) { 71 // 选择框的处理 72 case "select-one": 73 case "select-multiple": 74 arr.push(encodeURIComponent(field.name) + "=" + encodeURIComponent(this.getSelectValue(field))); 75 break; 76 77 // 不发送下列类型的表单字段 78 case undefined : 79 case "button" : 80 case "submit" : 81 case "reset" : 82 case "file" : 83 break; 84 85 // 单选、多选和其他类型的表单处理 86 case "checkbox" : 87 if(checkboxName == null) { 88 checkboxName = field.name; 89 arr.push(encodeURIComponent(checkboxName) + "=" + encodeURIComponent(this.getCheckboxValue(form.elements[checkboxName]))); 90 } 91 break; 92 case "radio" : 93 if(!field.checked) { 94 break; 95 } 96 default: 97 if(field.name.length > 0) { 98 arr.push(encodeURIComponent(field.name) + "=" + encodeURIComponent(field.value)); 99 } 100 }101 }102 return arr.join("&");103 } 104 };

    一个简单的demo:1  

    2 姓名:
    3 性别: 男 4 女
    5 爱好: 6 篮球 7 足球 8 乒乓球 9 羽毛球10
    11 年级:12 13 一年级14 二年级15 三年级16 17
    18 其他:19
    20 21
    22 23 24 25

    1   var form = document.getElementById("form1"), 2 output = document.getElementById("output"); 3 4 // 自定义的提交事件 5 EventUtil.addEventListener(form,"submit", function(event) { 6 event = EventUtil.getEvent(event); 7 EventUtil.preventDefault(event); 8 var html = ""; 9 html += form.elements['name'].value + "
    ";10 html += formUtil.getRadioValue(form.elements['sex']) + "
    ";11 html += formUtil.getCheckboxValue(form.elements['hobby']) + "
    ";12 html += formUtil.getSelectValue(form.elements['class']) + "
    ";13 html += form.elements['other'].value + "
    ";14 html += decodeURIComponent(formUtil.serialize(form)) + "
    ";15 output.innerHTML = html;16 });

    PS:代码出现的EventUtil在”跨浏览器的事件侦听器和事件对象“这篇文章有介绍。链接:http://www.cnblogs.com/yuanke/p/5045821.html

    本文网址:http://www.shaoqun.com/a/169879.html

    *特别声明:以上内容来自于网络收集,著作权属原作者所有,如有侵权,请联系我们:admin@shaoqun.com。

    序列

    0

    展开全文
  • 一个很好的博文:改变单选按钮radio的默认样式 里面有演示例子的网页链接和效果图,还有代码,总体很好,摘过来学习一下,顺便记录学习体会。 我把上面博文的例子按照我需要的样式进行了修改,并放入到我任务的...

    一个很好的博文:改变单选按钮radio的默认样式

    里面有演示例子的网页链接和效果图,还有代码,总体很好,摘过来学习一下,顺便记录学习体会。

    我把上面博文中的例子按照我需要的样式进行了修改,并放入到我任务的代码中,实现了样式的改变,如图:

    但点击时却发现按钮样式毫无变化,甚至是没反应。

    对比Demo中的例子研究了很久,找到了原因:

    我一开始写的代码如下:

    <label class="radio" for="problem-type">
    	<div><input type="radio" name="problem-type" value="1" class="radio-type"><i></i><span>宕机、卡、慢</span></div>
    </label>
    <label class="radio" for="problem-type">
    	<div><input type="radio" name="problem-type" value="2" class="radio-type"><i></i><span>数据源取数</span></div>
    </label>
    <label class="radio" for="problem-type">
    	<div><input type="radio" name="problem-type" value="3" class="radio-type"><i></i><span>模板制作类</span></div>
    </label>

    我在<label>标签中,按照学习的知识,写上了for="...",用来表示这个label是为哪组单选按钮设定的。但后来经过对比发现,不需要加上这个for属性,也可以实现这组单选按钮,因为input标签的name属性已经设定了相同的值。

    去掉label标签的for属性之后,页面的单选按钮即可正常点击并实现预期效果了。实现如下图:

    展开全文
  • 第一单选按钮: Male Female 如下图: 第二复选框: I have a bike I have a car 如下图: 单选按钮(Radio Buttons)是通过name属性来分组的,也就是说必须使用相同的name,radio才会形成单选,如上面...

    第一单选按钮:

    <form>
    <input type="radio" name="sex" value="male" /> Male
    <br />
    <input type="radio" name="sex" value="female" /> Female
    </form>

    如下图:



    第二复选框:

    <form>
    <input type="checkbox" name="bike" />
    I have a bike
    <br />
    <input type="checkbox" name="car" />
    I have a car
    </form>

    如下图:



    单选按钮(Radio Buttons)是通过name属性来分组的,也就是说必须使用相同的name,radio才会形成单选,如上面的例子,Male和Female的radio的name属性都是sex。如果name不同,是不具备单选这个效果的。

    针对不同的radio,当让name属性是相同的,但是它们的value属性是不同的,当表单提交时就会提交已选radio的value属性的值,这样在处理模块中是可以直接获取的。

    而与复选框(checkbox)进行比较,当多个checkbox使用相同的名字时,在mvc里面会形成数组。

    展开全文
  • <pre><code><tr> <td > ...input type="radio" name="radio1" value="Masseur" />...<p>when coming back to this page using a go back button in next page i want the radio button selected ...
  • <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>vue</title> <script src="../vue.js"></script> </head>...
  • <p>I got this form. They added a radio button selection. Now I would like the url behind the submit button to change depending on which radio button is selected. So every choice gets his own url ...
  • 表单中,我们可以通过onclick属性,动态的判断单选按钮的有效性。 e。g <input name="y" type="radio" onClick="m.checked=false;" value=1 checked>有 <input type="radio" name="m" onclick="y.checked...
  • 如何在javascript获得表单中单选按钮的值并判断选择的是哪一个,请大家帮帮忙,谢谢
  • 主要介绍了js表单处理中单选、多选、选择框值的获取及表单的序列化的相关资料,需要的朋友可以参考下
  • 表单中单选和复选框问题
  • php代码中获取表单中单选按钮的值:(单选按钮只能让我们选择一个,这里有一个“checked”属性,这是用来默认选取的,我们每次刷新我们的页面时就默认为这个值。) 例:<form name="myform" action="" method=...
  • php代码中获取表单中单选按钮的值:(单选按钮只能让我们选择一个,这里有一个“checked”属性,这是用来默认选取的,我们每次刷新我们的页面时就默认为这个值。) 例: 1 <formname="myform...
  • 里所说的,用jquery去验证某一组多选至少要有一个选中,某一组单选至少有一个选中,,大家都知道单一的一个用js比较好验证,但是想要用jquery的验证并且用到jquery验证的提示信息,那么这就不好办了
  • 本篇文章主要介绍了ReactJS实现表单单选多选和反选的示例,非常具有实用价值,需要的朋友可以参考下本文介绍了ReactJS实现表单单选多选和反选的示例,分享给大家,希望对大家有所帮助。需求是对列表实现单选,...
  • antdesign 表单中单选按钮处理

    千次阅读 2018-06-22 14:05:08
    如上图所示,是一个单选按钮,如果需要获取单选按钮的默认值,那样怎么处理呢? 代码: class FilterForm extends ListFilterForm { constructor() { super(); this.state = { //先声明变量并初始化 isAll...
  • 要做一个单选框,封装的css样式是radio-box,但是一旦引用了这个样式,就触发不了onclick事件(至今没解决),所以就想着自己写一个简单的样式。 <style type="text/css"> .rad{ width: 18px; height: ...
  • 例子改变的是单选框的样式,多选框同理。改变属性即可 html: <div> 请选择性别: <label class="radio-item"> <!-- 默认的按钮 --> <input name="gender" type="radio"...
  • 在网页制作中单选框和复选框是常用的功能之一。表单单选框与复选框是通过input标签设置type属性值来实现的。type="radio"为单选域,type="checkbox"为复选域。 表单单选框中 type="radio" 中name属性取值需要相同...
  • 在前端,在编辑单选框以及多选框时候,一般属性有name和value,也可以将当前的多选框和单选框输入一个表示的值。比如: 1、单选框 bike walk 对于单选框,value和你的文本内容是相同的,那可不可以不写value呢...
  • 多选 <input type="checkbox" ng-model='game' ng-true-value="1" ng-false-value="0"/>游戏 <input type="checkbox" ng-model="video" ng-true-value="1" ng-false-value="0"/>...单选 ...

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 2,686
精华内容 1,074
关键字:

表单中单选