TeddyWang
- 浏览: 506887 次
- 性别:
- 来自: 深圳
-
文章分类
- 全部博客 (299)
- Oracle（pl/sql_Erp_Pro*C） (69)
- 设计模式 (4)
- spring (23)
- ext (17)
- apache开源项目应用 (4)
- jquery (16)
- 生活琐事 (8)
- 下载资源 (23)
- mysql (2)
- Eclipse使用积累 (5)
- 报表类（报表/图表） (13)
- php (4)
- Web多彩文本框 (3)
- json (4)
- jqgrid (2)
- ant (2)
- java算法积累 (8)
- EL表达式/JSTL (4)
- poi (3)
- gwt (2)
- 爬网第一步 (2)
- javascript (17)
- Javaweb (8)
- tomcat (1)
- flex (1)
- Java&DB (3)
- J2SE (7)
- linux (3)
- 数据结构 (1)
- dot net (5)
- struts (1)
- ibatis (1)
- log4j (1)
- 项目管理 (1)
- Java native interface(jni,jacob......) (5)
- applet (1)
- VB.net/C#.net/JNI (20)
- css (1)
- Sqlite (1)
- servlet (1)
- REST (1)
最新评论
-
wenhurena：
能不能给一下解压密码roki.work.2017@gmail. ...
Ebs解体新書と学習資料1 -
liutao1600：
楼主写的太好了，每天学习～～
Spring_MVC(6)测试 -
liutao1600：
太好了，每天学习你的文章～～～
Spring_MVC(3)表单页面处理 -
liutao1600：
学习了，太好了
Spring_MVC(2)控制层处理 -
liutao1600：
学习了～～～
Spring_MVC(1)构建简单web应用
一、获取下拉列表选中项的值和文本(select)
代码 select.htm 示例如下：
=============================================================================
<html>
<head><title>获取下拉列表选中项的值和文本(select)</title></head>
<body>
<script>
//获取下拉列表选中项的文本
function getSelectedText(name){
var obj=document.getElementById(name);
for(i=0;i<obj.length;i++){
if(obj[i].selected==true){
return obj[i].innerText; //关键是通过option对象的innerText属性获取到选项文本
}
}
}
//获取下拉列表选中项的值
function getSelectedValue(name){
var obj=document.getElementById(name);
return obj.value; //如此简单，直接用其对象的value属性便可获取到
}
</script>
<select id="myselect">
<option value="fist">1</option>
<option value="second">2</option>
<option value="third">3</option>
</select>
<input type="button" value="所选文本" onclick="alert(getSelectedText('myselect'));" />
<input type="button" value="所选值" onclick="alert( getSelectedValue('myselect'));" />
</body>
</html>
=============================================================================
二、获取单选按钮(radio)组的值和修改选中项
看到很多帖子里说js获取单选按钮(radio)组的值可以直接用document.getElementById("oper").value,虽然跟单选按钮组一样的下拉列表(也是列表项的数组)也是一个数组，用这种方式可以获到下拉列表的值,但是单选按钮组却获不到所选的值。仔细研究了下，总结如下：
与下拉列表不同，单选按钮须用this.form.oper或者document.getElementsByName('oper')方式获取该数组对象，document.getElementById('oper')不能获取该数组对象(select可以)。而且要获取值须通过一循环判断获取，不能直接用.value(select可以)。而要改变单选按钮组的选中项，也须用循环判断改变各个单选按钮的value。
测试代码radio.html 如下:
=============================================================================
<html>
<head></head>
<script language="javascript">
//求单选按纽的值，适用单选项及多选项。未选返回false；有选择项，返回选项值。
function getRadio(oRadio){
var oRadioLength= oRadio.length;
var oRadioValue = false;
//alert("oRadioLength:["+oRadioLength+"]");
if (oRadioLength== undefined){
if (oRadio.checked){
oRadioValue = oRadio.value;
}
}else{
for (i=0;i<oRadioLength;i++){
//alert("oRadio["+i+"]:"+oRadio[i].checked+"/"+oRadio[i].value);
if (oRadio[i].checked){
oRadioValue = oRadio[i].value;
break;
}
}
}
return oRadioValue;
}
//方法改进：
//求单选按纽的值，传radio名字作为参数。未选返回false；有选择项，返回选项值。
function getRadioValue(name){
var radioes = document.getElementsByName(name);
for(var i=0;i<radioes.length;i++)
{
if(radioes[i].checked){
return radioes[i].value;
}
}
return false;
}
//通过值修改所选中的单选按钮
function changeRadio(oRadio,oRadioValue){ //传入一个对象
for(var i=0;i<oRadio.length;i++) //循环
{
if(oRadio[i].value==oRadioValue) //比较值
{
oRadio[i].checked=true; //修改选中状态
break; //停止循环
}
}
}
//改进：
//通过值修改所选中的单选按钮
function setRadio(name,sRadioValue){ //传入radio的name和选中项的值
var oRadio = document.getElementsByName(name);
for(var i=0;i<oRadio.length;i++) //循环
{
if(oRadio[i].value==sRadioValue) //比较值
{
oRadio[i].checked=true; //修改选中状态
break; //停止循环
}
}
}
</script>
<body>
<form name="frm">
<input type="radio" name="oper" value="agree" >同意</td>
<input type="radio" name="oper" value="downchange" checked>下发修改</td>
<input type="radio" name="oper" value="refuse">拒保</td>
<input type="radio" name="oper" value="report" >上报 </td>
<br>
alert('result:'+getRadio(this.form.oper))
<input type="button" name="test1" value="按钮1" onclick="alert('result:'+getRadio(this.form.oper));">
<br>
alert('result:'+getRadio(document.getElementById('oper')))
<input type="button" name="test2" value="按钮2" onclick="alert('result:'+getRadio(document.getElementById('oper')));">
<br>
alert(this.form.oper.value)
<input type="button" name="test3" value="按钮3" onclick="alert(this.form.oper.value);">
<br>
changeRadio(this.form.oper,"上报")
<input type="button" name="test4" value="按钮4" onclick="changeRadio(this.form.oper,'report');">
<br><br><br><br>
<select id="slt">
<option value="agree" >同意</option>
<option value="downchange" selected>下发修改</option>
<option value="refuse">拒保</option>
<option value="report">上报</option>
</select>
<br>
alert(this.form.slt.value)
<input type="button" name="test5" value="按钮5" onclick="alert(this.form.slt.value);">
<br>
document.getElementById('slt')[2].innerText)
<input type="button" name="test6" value="按钮6" onclick="alert(document.getElementById('slt')[2].innerText);">
</form>
</body>
代码 select.htm 示例如下：
=============================================================================
<html>
<head><title>获取下拉列表选中项的值和文本(select)</title></head>
<body>
<script>
//获取下拉列表选中项的文本
function getSelectedText(name){
var obj=document.getElementById(name);
for(i=0;i<obj.length;i++){
if(obj[i].selected==true){
return obj[i].innerText; //关键是通过option对象的innerText属性获取到选项文本
}
}
}
//获取下拉列表选中项的值
function getSelectedValue(name){
var obj=document.getElementById(name);
return obj.value; //如此简单，直接用其对象的value属性便可获取到
}
</script>
<select id="myselect">
<option value="fist">1</option>
<option value="second">2</option>
<option value="third">3</option>
</select>
<input type="button" value="所选文本" onclick="alert(getSelectedText('myselect'));" />
<input type="button" value="所选值" onclick="alert( getSelectedValue('myselect'));" />
</body>
</html>
=============================================================================
二、获取单选按钮(radio)组的值和修改选中项
看到很多帖子里说js获取单选按钮(radio)组的值可以直接用document.getElementById("oper").value,虽然跟单选按钮组一样的下拉列表(也是列表项的数组)也是一个数组，用这种方式可以获到下拉列表的值,但是单选按钮组却获不到所选的值。仔细研究了下，总结如下：
与下拉列表不同，单选按钮须用this.form.oper或者document.getElementsByName('oper')方式获取该数组对象，document.getElementById('oper')不能获取该数组对象(select可以)。而且要获取值须通过一循环判断获取，不能直接用.value(select可以)。而要改变单选按钮组的选中项，也须用循环判断改变各个单选按钮的value。
测试代码radio.html 如下:
=============================================================================
<html>
<head></head>
<script language="javascript">
//求单选按纽的值，适用单选项及多选项。未选返回false；有选择项，返回选项值。
function getRadio(oRadio){
var oRadioLength= oRadio.length;
var oRadioValue = false;
//alert("oRadioLength:["+oRadioLength+"]");
if (oRadioLength== undefined){
if (oRadio.checked){
oRadioValue = oRadio.value;
}
}else{
for (i=0;i<oRadioLength;i++){
//alert("oRadio["+i+"]:"+oRadio[i].checked+"/"+oRadio[i].value);
if (oRadio[i].checked){
oRadioValue = oRadio[i].value;
break;
}
}
}
return oRadioValue;
}
//方法改进：
//求单选按纽的值，传radio名字作为参数。未选返回false；有选择项，返回选项值。
function getRadioValue(name){
var radioes = document.getElementsByName(name);
for(var i=0;i<radioes.length;i++)
{
if(radioes[i].checked){
return radioes[i].value;
}
}
return false;
}
//通过值修改所选中的单选按钮
function changeRadio(oRadio,oRadioValue){ //传入一个对象
for(var i=0;i<oRadio.length;i++) //循环
{
if(oRadio[i].value==oRadioValue) //比较值
{
oRadio[i].checked=true; //修改选中状态
break; //停止循环
}
}
}
//改进：
//通过值修改所选中的单选按钮
function setRadio(name,sRadioValue){ //传入radio的name和选中项的值
var oRadio = document.getElementsByName(name);
for(var i=0;i<oRadio.length;i++) //循环
{
if(oRadio[i].value==sRadioValue) //比较值
{
oRadio[i].checked=true; //修改选中状态
break; //停止循环
}
}
}
</script>
<body>
<form name="frm">
<input type="radio" name="oper" value="agree" >同意</td>
<input type="radio" name="oper" value="downchange" checked>下发修改</td>
<input type="radio" name="oper" value="refuse">拒保</td>
<input type="radio" name="oper" value="report" >上报 </td>
<br>
alert('result:'+getRadio(this.form.oper))
<input type="button" name="test1" value="按钮1" onclick="alert('result:'+getRadio(this.form.oper));">
<br>
alert('result:'+getRadio(document.getElementById('oper')))
<input type="button" name="test2" value="按钮2" onclick="alert('result:'+getRadio(document.getElementById('oper')));">
<br>
alert(this.form.oper.value)
<input type="button" name="test3" value="按钮3" onclick="alert(this.form.oper.value);">
<br>
changeRadio(this.form.oper,"上报")
<input type="button" name="test4" value="按钮4" onclick="changeRadio(this.form.oper,'report');">
<br><br><br><br>
<select id="slt">
<option value="agree" >同意</option>
<option value="downchange" selected>下发修改</option>
<option value="refuse">拒保</option>
<option value="report">上报</option>
</select>
<br>
alert(this.form.slt.value)
<input type="button" name="test5" value="按钮5" onclick="alert(this.form.slt.value);">
<br>
document.getElementById('slt')[2].innerText)
<input type="button" name="test6" value="按钮6" onclick="alert(document.getElementById('slt')[2].innerText);">
</form>
</body>
分享到：
发表评论
-
online js格式化工具
2010-10-28 10:35 753http://jsbeautifier.org/ -
JS屏蔽ie页面键盘按键代码
2010-05-07 20:11 1649<script language="j ... -
网络播放器代码flv
2010-05-05 08:31 2574flv网页播放器 http://www.longta ... -
播放flv文件的html代码
2010-05-05 01:01 3838<object classid="cls ... -
js树形菜单大全
2010-05-04 23:16 844源码 -
树形菜单
2010-05-04 23:09 723源代码 -
省市区三级联动菜单数据库
2010-04-21 19:44 1225联动 -
万能网页播放插件实例
2010-04-20 19:22 1971<html><body><emb ... -
html页面控制播放器插件
2010-04-20 18:51 2258<embed src="swf/1. ... -
codeLib之javaScript之父子窗口问题2
2010-01-17 12:56 9632.window.showModalDialog() ... -
codeLib之javaScript之父子窗口问题1
2010-01-17 12:19 9591.window.open() 在父窗口中调用win ... -
正则表达式学习实例（写java正则表达式的时候需要修改/）
2009-11-03 23:22 1081匹配中文字符的正则 ... -
正则表达式入门
2009-05-07 14:14 735元字符: /b 代表着单词 ... -
javascript课件(自用有密码)
2009-05-05 14:14 929自用课件。不予共享。 -
js通过下拉菜单选择不同的div显示
2009-04-23 10:18 2222<!DOCTYPE HTML PUBLIC " ... -
Javascript类内方法定义
2009-04-10 10:33 1139//构造函数\原型方法混合法定义类 function Car( ...
相关推荐
但js中想获取它并操作它。直接使用EL表达式，js把它识别成字符串了。不是我想要的啊。。网上搜了搜大家的解决方案…最好的当然是把List集合转成json格式传到界面上。这样js里面操作也简单，页面也没有影响。 解决： ...
解压得到名为"schedule"的目录 2、打开界面。双击里面的schedule v1.1.html打开 3、解除限制。单击浏览器弹出框“允许阻止的内容”,可以看到效果 功能说明： 界面采用bootstrap和JEasyUI技术实现，提供三种任务运行...
利用反射将实例化得到的实体对象转换为JSON格式的字符串，前台JS转换为JSON对象后使用Jquery将值绑定到页面对应的控件中。便利：不需要后台代码逐行一个个控件进行付值
6.4.3 CSS值元素选择符 6.4.4 Ext.query与Ext.select 6.5 应用模板 6.5.1 Ext.Template 6.5.2 Ext.XTemplate 第7章 设计表单类布局 7.1 Form表单简介 7.1.1 Form表单的基本配置 7.1.2 ExtJS对Form表单的封装...
6.4.3 CSS值元素选择符 6.4.4 Ext.query与Ext.select 6.5 应用模板 6.5.1 Ext.Template 6.5.2 Ext.XTemplate 第7章 设计表单类布局 7.1 Form表单简介 7.1.1 Form表单的基本配置 7.1.2 ExtJS对Form表单的封装...
解码得到url值 编码传入url JavaScript客户端脚本输出帮助类 弹出信息,并跳转指定页面。 弹出信息,并返回历史页面 弹出信息 并指定到父窗口 注册脚本块 返回把指定链接地址显示模态窗口的脚本 把指定链接地址显示...
webupload上传照片，前台获得照片的exif信息中的orientation属性的值，提交后台进行旋转
它在生产模式下正确捆绑了React，并优化了构建以获得最佳性能。 生成被最小化，并且文件名包括哈希值。 您的应用已准备好进行部署！ 有关更多信息，请参见关于的部分。yarn eject 注意：这是单向操作。 eject ，您...
Create React App入门 ... 它在生产模式下正确捆绑了React，并优化了构建以获得最佳性能。 生成被最小化，并且文件名包括哈希值。 您的应用已准备好进行部署！ 有关更多信息，请参见关于的部分。 npm run ej
选择图片--上传到服务器（php）--返回路径--前台获得路径显示图片--crop图--发送位置数据到后台---后台裁剪图片--返回裁剪后的路径到前台显示 ###Jcrop 是一个功能强大的 jQuery 图像裁剪插件,结合后端程序(如:PHP)...
选择图片--上传到服务器（php）--返回路径--前台获得路径显示图片--crop图--发送位置数据到后台---后台裁剪图片--返回裁剪后的路径到前台显示 ###Jcrop 是一个功能强大的 jQuery 图像裁剪插件,结合后端程序(如:PHP)...
php json_decode返回数据js的处理 php json_decode后，返回到前台的数据如：encode_str =》{“green”:10,”size”:5,”strock”:12} 则js通过 eval(“obj = ” + encode_str + “;”) ; 便可将json数据实例...
要获取一个ashx页面的到的数据，使用以下方法： 1. 代码如下: WebClient wc = new... 前台代码：”hd_num” runat=”server”> 再通过js获取hd_num的值。 2. 代码如下: HttpWebRequest request = HttpWebRequest.Create
jQuery EasyUI是基于JQuery的一个前台ui界面的插件，功能相对没extjs强大，但页面也是相当好看的，同时页面支持各种themes以满足使用者对于页面不同风格的喜好。一些功能也足够开发者使用，相对于extjs更轻量。 ...
FCKeditor2.6zip是其最新的Javascript文件和图片等； FCKeditor.NET.zip是一个ASP.NET控件DLL文件。 下面结合一个ASP.NET2.0的项目来具体看看FCKeditor的安装、配置、使用。在开始之前请先下载FCKeditor文件包和...
1、购买系统后到下载地址下载MinBBS V1.0 服务端（文件名MinBBS_V1.0_Server.zip），下载后解压，解压后得到目录“minapp”。 2、上传minapp目录到您的discuz根目录下。 3、修改minapp/1.0目录下的config.php第7行...
目标是创建没有ViewState，没有JavaScript，没有CSS，没有UpdatePanel，没有WebServices的Web应用程序。 支持的浏览器: IE 7.0+, Firefox 3.0+, Chrome 2.0+, Opera 9.5+, Safari 3.0+ 注：ExtAspNet基于一些开源...
1. 有直接用框架的：Ajaxpro和Ajax，这两种我用过了，觉得不错 2. 还有一种就是用微软专门为...//这里返回的就是前台得到的值，反正参数已经进CS文件了，想怎么操作就怎么操作，包括读库都可以。 5. 客户端调用。 ...
目标是创建没有JavaScript，没有CSS，没有UpdatePanel，没有WebServices的Web应用程序。 支持的浏览器: IE 7.0+, Firefox 3.0+, Chrome 2.0+, Opera 9.5+, Safari 3.0+ 注：ExtAspNet基于一些开源的程序ExtJS, ...