Struts2的s:radio标签使用及用jquery添加change事件


Posted in Javascript onApril 08, 2013

struts2中s:radio标签的使用总结

遇到的问题:在使用该标签时,设置了默认选中项,但提交数据返回后,单选框不能显示之前选中的项,仍然为默认选项
通过测试得出以下结论:

以<s:radio name="user.sex" list="%{#{'1':'男','0':'女'}}" theme="simple"></s:radio>为例
在使用s:radio标签的时候,如果要使该标签默认选中一项,可以通过两种方法
1、通过js代码实现

document.getElementsByName('user.sex')[0].checked=true;//默认选中男

2、通过添加value属性
<s:radio name="user.sex" list="%{#{'1':'男','0':'女'}}" value="1" theme="simple"></s:radio>

在通过value属性设置单选框的默认选项时,无论何时页面刷新后单选框的状态都是选中该默认项
因此,如果要让数据提交后台后,该单选框仍然是之前选中的项,不能通过value属性设置它的默认项,应该通过第一种方法设置
此外,后台能够正确获取该单选框的值,而与value的设置无关

用jquery给Struts2的<s:radio />标签添加change事件

用到Struts2的<s:radio/>标签时想给它添加一个change事件,由于此标签为页面自动生成一个radio组,不能像平常那样控制。网上说了一大堆,也没找到一个满意的。如果像以前那样给此<s:radio />设定一个id,那样生成的radio组中会自动添加一个数字,如:

<input type="radio" name="file" id="upfile_file0" value="0"><label for="upfile_file0">否</label> 
<input type="radio" name="file" id="upfile_file1" checked="checked" value="1" class="filetype"><label for="upfile_file1">是</label>

这时可以借助jquery来实现,很简单,给此<s:radio/>添加一个属性cssClass="filetype",就会给每个radio添加一个css类,上面可以看得出来,那么接下来代码如下所示:
$(function(){ 
$(".filetype").change(function(){ 
var val = $("input[name='file']:checked").val();//获得选中的radio的值 
if(val=='1'){ 
alert(“是”); 
}else{ 
alert(“否”); 
} 
}); 
});
Javascript 相关文章推荐
jQuery使用手册之三 CSS操作
Mar 24 Javascript
js 可拖动列表实现代码
Dec 13 Javascript
javascript创建和存储cookie示例
Jan 07 Javascript
js 获取时间间隔实现代码
May 12 Javascript
jQuery插件ajaxFileUpload实现异步上传文件效果
Apr 14 Javascript
js插件YprogressBar实现漂亮的进度条效果
Apr 20 Javascript
AngularJs 60分钟入门基础教程
Apr 03 Javascript
JS常用字符串方法(推荐)
Jan 15 Javascript
js实现选项卡内容切换以及折叠和展开效果【推荐】
Jan 08 Javascript
node操作mysql数据库实例详解
Mar 17 Javascript
React 无状态组件(Stateless Component) 与高阶组件
Aug 14 Javascript
vue生命周期实例小结
Aug 15 Javascript
Jquery图片滚动与幻灯片的实例代码
Apr 08 #Javascript
Js动态添加复选框Checkbox的实例方法
Apr 08 #Javascript
JS解决url传值出现中文乱码的另类办法
Apr 08 #Javascript
JS继承--原型链继承和类式继承
Apr 08 #Javascript
原生js实现shift/ctrl/alt按键的获取
Apr 08 #Javascript
原生js实现跨浏览器获取鼠标按键的值
Apr 08 #Javascript
纯js实现瀑布流展现照片(自动适应窗口大小)
Apr 08 #Javascript
You might like
MOTOROLA 摩托罗拉 MODEL 66-XI五灯中波收音机
2021/03/02 无线电
php若干单维数组遍历方法的比较
2011/09/20 PHP
PHP If Else(elsefi) 语句
2013/04/07 PHP
php中get_headers函数的作用及用法的详细介绍
2013/04/27 PHP
修改php.ini以达到屏蔽错误信息并记录日志
2013/06/16 PHP
IIS+fastcgi下PHP运行超时问题的解决办法详解
2013/06/20 PHP
在WordPress中使用wp-cron插件来设置定时任务
2015/12/10 PHP
Joomla调用系统自带编辑器的实现方法
2016/05/05 PHP
thinkphp隐藏index.php/home并允许访问其他模块的实现方法
2016/10/13 PHP
php+resumablejs实现的分块上传 断点续传功能示例
2017/04/18 PHP
PHP实用小技巧之调用录像的方法
2019/12/05 PHP
Javascript 面向对象(三)接口代码
2012/05/23 Javascript
详解JavaScript中数组的reduce方法
2016/12/02 Javascript
javascript实现多张图片左右无缝滚动效果
2017/03/22 Javascript
JS中的三个循环小结
2017/06/20 Javascript
CryptoJS中AES实现前后端通用加解密技术
2018/12/18 Javascript
vue实现动态显示与隐藏底部导航的方法分析
2019/02/11 Javascript
原生js实现自定义难度的扫雷游戏
2021/01/22 Javascript
Python函数学习笔记
2008/10/07 Python
一个检测OpenSSL心脏出血漏洞的Python脚本分享
2014/04/10 Python
跟老齐学Python之折腾一下目录
2014/10/24 Python
用Python shell简化开发
2018/08/08 Python
python 实现识别图片上的数字
2019/07/30 Python
美国打印机墨水和碳粉购物网站:QuikShip Toner
2018/08/29 全球购物
Under Armour西班牙官网:美国知名的高端功能性运动品牌
2018/12/12 全球购物
澳大利亚宠物食品和用品商店:PETstock
2020/01/02 全球购物
高中历史教学反思
2014/02/08 职场文书
球队口号
2014/06/18 职场文书
租房安全协议书
2014/08/20 职场文书
工作经常出错的检讨书
2014/09/13 职场文书
2014年个人技术工作总结
2014/12/08 职场文书
2015年乡镇卫生院妇幼保健工作总结
2015/05/19 职场文书
Python insert() / append() 用法 Leetcode实战演示
2021/03/31 Python
python制作图形界面的2048游戏, 基于tkinter
2021/04/06 Python
python 破解加密zip文件的密码
2021/04/22 Python
go 实现简易端口扫描的示例
2021/05/22 Golang