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插件
Feb 24 Javascript
jquery 选项卡效果 新手代码
Jul 08 Javascript
JavaScript实现多栏目切换效果
Dec 12 Javascript
JS数字千分位格式化实现方法总结
Dec 16 Javascript
jQuery Ajax全解析
Feb 13 Javascript
Vue.js父与子组件之间传参示例
Feb 28 Javascript
浅谈node中的exports与module.exports的关系
Aug 01 Javascript
p5.js入门教程之图片加载
Mar 20 Javascript
解决vue项目nginx部署到非根目录下刷新空白的问题
Sep 27 Javascript
浅谈JavaScript面向对象--继承
Mar 20 Javascript
js实现无限瀑布流实例方法
Sep 16 Javascript
关于Js中new操作符的作用详解
Feb 21 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
php简单获取文件扩展名的方法
2015/03/24 PHP
thinkphp查询,3.X 5.0方法(亲试可行)
2017/06/17 PHP
JSON序列化与解析原生JS方法且IE6和chrome测试通过
2013/09/05 Javascript
jQuery实现带延迟效果的滑动菜单代码
2015/09/02 Javascript
jQuery中deferred对象使用方法详解
2016/07/14 Javascript
canvas压缩图片转换成base64格式输出文件流
2017/03/09 Javascript
在webstorm开发微信小程序之使用阿里自定义字体图标的方法
2018/11/15 Javascript
实现一个 Vue 吸顶锚点组件方法
2019/07/10 Javascript
vue搜索页开发实例代码详解(热门搜索,历史搜索,淘宝接口演示)
2020/04/11 Javascript
jQuery 移除事件的方法
2020/06/20 jQuery
Vue移动端项目实现使用手机预览调试操作
2020/07/18 Javascript
python检查字符串是否是正确ISBN的方法
2015/07/11 Python
Python使用Paramiko模块编写脚本进行远程服务器操作
2016/05/05 Python
Python运行报错UnicodeDecodeError的解决方法
2016/06/07 Python
Python中列表list以及list与数组array的相互转换实现方法
2017/09/22 Python
python3.4.3下逐行读入txt文本并去重的方法
2018/04/29 Python
对python读写文件去重、RE、set的使用详解
2018/12/11 Python
Python下应用opencv 实现人脸检测功能
2019/10/24 Python
PyTorch学习:动态图和静态图的例子
2020/01/06 Python
Python reduce函数作用及实例解析
2020/05/08 Python
Python使用Chrome插件实现爬虫过程图解
2020/06/09 Python
python在地图上画比例的实例详解
2020/11/13 Python
ProBikeKit新西兰:自行车套件,跑步和铁人三项装备
2017/04/05 全球购物
香港零食网购:上仓胃子
2020/06/08 全球购物
如何在发生故障的节点上重新安装 SQL Server
2013/03/14 面试题
医护人员英文求职信范文
2013/11/26 职场文书
一句话工作感言
2014/03/01 职场文书
房屋委托书范本
2014/04/04 职场文书
医院保洁员岗位职责
2015/02/13 职场文书
2015年公务员个人工作总结
2015/04/24 职场文书
酒店温馨提示语
2015/07/14 职场文书
2016年9月份红领巾广播稿
2015/12/21 职场文书
高中语文教学反思范文
2016/02/16 职场文书
《角的初步认识》教学反思
2016/02/17 职场文书
《小蝌蚪找妈妈》教学反思
2016/02/23 职场文书
yyds什么意思?90后已经听不懂00后讲话了……
2022/02/03 杂记