JS获取下拉框显示值和判断单选按钮的方法


Posted in Javascript onJuly 09, 2015

本文实例讲述了JS获取下拉框显示值和判断单选按钮的方法。分享给大家供大家参考。具体如下:

1.本人做过很多项目,都需要得到select组件显示的值。下面是我经常用到的方法:

Html源码如下:

<html><body>
<select id="province" name="province" >
<option value="1">北京</option>
<option value="2">上海</option>
<option value="3">江苏</option>
<option value="4">河北</option>
</select>
<br/>
<input type="text" id="provinceName" name="provinceName"/>
<input type="button" onClick="setTxt()" value="赋值"/>
</body></html>

JS函数如下:

function setTxt()
{
 var _selObj=document.getElementByIdx_xx('province');//取下拉框的元素
 var _selVal=_selObj[_selObj.selectedIndex].text;//取下拉框被选中的值
 document.getElementByIdx_xx('provinceName').value=_selVal;
}

2.本人也做过很多判断radio单选按钮是否被选中的情况,下面是我常用到得方法:

HTML页面源码如下:

<html><body>
<input type="radio" name="time" value="2009-05-20"/>2009-05-20
<input type="radio" name="time" value="2009-05-21"/>2009-05-21
<input type="radio" name="time" value="2009-05-22"/>2009-05-22
<input type="radio" name="time" value="2009-05-23"/>2009-05-23
<input type="button" value="判断是否选择" onclick="alert(judge())"/>
</body></html>

JS函数代码:

function judge()
{ var status =false;
 var _radObj=document.getElementsByName('time');
 for(var i =0;i<_radObj.length;i++){
  if(_radObj[i].checked){
  status=true;
  }
 }
 if(! status){
  alert('未选中时间!');
 }
 return status;
}

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

Javascript 相关文章推荐
在iframe里的页面编写js,实现在父窗口上创建动画效果展开和收缩的div(不变动iframe父窗口代码)
Dec 20 Javascript
jQuery中siblings()方法用法实例
Jan 08 Javascript
js为什么不能正确处理小数运算?
Dec 29 Javascript
详解javascript实现瀑布流列式布局
Jan 29 Javascript
Vue如何引入远程JS文件
Apr 20 Javascript
input框中自动展示当前日期yyyy/mm/dd的实现方法
Jul 06 Javascript
vue实现单选和多选功能
Aug 11 Javascript
JS实现的ajax和同源策略(实例讲解)
Dec 01 Javascript
jQuery中的类名选择器(.class)用法简单示例
May 14 jQuery
Vue 实例事件简单示例
Sep 19 Javascript
node.JS路径解析之PATH模块使用方法详解
Feb 06 Javascript
JS FormData对象使用方法实例详解
Feb 12 Javascript
JavaScript的类型、值和变量小结
Jul 09 #Javascript
JS实现文档加载完成后执行代码
Jul 09 #Javascript
jQuery检测某个元素是否存在代码分享
Jul 09 #Javascript
jquery.map()方法的使用详解
Jul 09 #Javascript
jQuery实现鼠标点击弹出渐变层的方法
Jul 09 #Javascript
javascript+ajax实现产品页面加载信息
Jul 09 #Javascript
浅谈JavaScript中null和undefined
Jul 09 #Javascript
You might like
解决中英文字符串长度问题函数
2007/01/16 PHP
win7 wamp 64位 php环境开启curl服务遇到的问题及解决方法
2018/09/16 PHP
PHP 自动加载类原理与用法实例分析
2020/04/14 PHP
网页自动刷新,不产生嗒嗒声的一个解决方法
2007/03/27 Javascript
JS构建页面的DOM节点结构的实现代码
2011/12/09 Javascript
js设置function参数默认值(适合没有传参情况)
2014/02/24 Javascript
jquery的父子兄弟节点查找示例代码
2014/03/03 Javascript
用于deeplink的js方法(判断手机是否安装app)
2014/04/02 Javascript
js Calender控件使用详解
2015/01/05 Javascript
Nodejs为什么选择javascript为载体语言
2015/01/13 NodeJs
JavaScript中string对象
2015/06/12 Javascript
js简单实现Select互换数据的方法
2015/08/17 Javascript
实现easyui的datagrid导出为excel的示例代码
2016/11/10 Javascript
详解基于Vue,Nginx的前后端不分离部署教程
2018/12/04 Javascript
vue实现的组件兄弟间通信功能示例
2018/12/04 Javascript
VUE渲染后端返回含有script标签的html字符串示例
2019/10/28 Javascript
JavaScript进阶(三)闭包原理与用法详解
2020/05/09 Javascript
[46:20]TFT vs Secret Supermajor小组赛C组 BO3 第二场 6.3
2018/06/04 DOTA
Python爬虫利用cookie实现模拟登陆实例详解
2017/01/12 Python
浅谈对yield的初步理解
2017/05/29 Python
Django中使用Celery的方法示例
2018/11/29 Python
python 将对象设置为可迭代的两种实现方法
2019/01/21 Python
Django命名URL和反向解析URL实现解析
2019/08/09 Python
python 实现查询Neo4j多节点的多层关系
2019/12/23 Python
使用python-cv2实现Harr+Adaboost人脸识别的示例
2020/10/27 Python
HTML5 微格式和相关的属性名称
2010/02/10 HTML / CSS
uniapp+Html5端实现PC端适配
2020/07/15 HTML / CSS
Ancheer官方户外和运动商店:销售电动自行车
2019/08/07 全球购物
师范毕业生个人求职信
2013/12/09 职场文书
四年的个人工作自我评价
2013/12/10 职场文书
文明学生事迹材料
2014/01/29 职场文书
经营管理策划方案
2014/05/22 职场文书
机械工程师岗位职责
2014/06/16 职场文书
警告通知
2015/04/25 职场文书
工人先锋号事迹材料(2016精选版)
2016/03/01 职场文书
JS实现简单的九宫格抽奖
2022/06/28 Javascript