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 相关文章推荐
javascript 简单高效判断数据类型 系列函数 By shawl.qiu
Mar 06 Javascript
jquery统计复选框选中示例
Nov 05 Javascript
js模拟C#中List的简单实例
Mar 06 Javascript
怎么限制input的text里输入的值只能是数字(正则、js)
May 16 Javascript
Three.js学习之正交投影照相机
Aug 01 Javascript
jQuery事件处理的特征(事件命名机制)
Aug 23 Javascript
JS中from 表单序列化提交的代码
Jan 20 Javascript
微信小程序 侧滑删除(左滑删除)
May 23 Javascript
Javascript实现运算符重载详解
Apr 07 Javascript
angularjs下ng-repeat点击元素改变样式的实现方法
Sep 12 Javascript
element-ui 的el-button组件中添加自定义颜色和图标的实现方法
Oct 26 Javascript
支付宝小程序tabbar底部导航
Nov 06 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
收集的DedeCMS一些使用经验
2007/03/17 PHP
php输出xml格式字符串(用的这个)
2012/07/12 PHP
CI框架开发新浪微博登录接口源码完整版
2014/05/28 PHP
php通过baihui网API实现读取word文档并展示
2015/06/22 PHP
yii用户注册表单验证实例
2015/12/26 PHP
JAVASCRIPT keycode总结
2009/02/04 Javascript
基于jquery的loading效果实现代码
2010/11/05 Javascript
更优雅的事件触发兼容
2011/10/24 Javascript
JavaScript实现的in_array函数
2014/08/27 Javascript
JS回调函数的应用简单实例
2014/09/17 Javascript
js中不同的height, top的区别对比
2015/09/24 Javascript
js+css简单实现网页换肤效果
2015/12/29 Javascript
jQuery form 表单验证插件(fieldValue)校验表单
2016/01/24 Javascript
JS设计模式之惰性模式(二)
2017/09/29 Javascript
vue组件横向树实现代码
2018/08/02 Javascript
浅谈Vue.js路由管理器 Vue Router
2018/08/16 Javascript
实例分析编写vue组件方法
2019/02/12 Javascript
es6数值的扩展方法
2019/03/11 Javascript
JS中的算法与数据结构之栈(Stack)实例详解
2019/08/20 Javascript
给你选择Python语言实现机器学习算法的三大理由
2017/11/15 Python
图解Python变量与赋值
2018/04/03 Python
pycharm 将python文件打包为exe格式的方法
2019/01/16 Python
Tensorflow tensor 数学运算和逻辑运算方式
2020/06/30 Python
python实现马丁策略的实例详解
2021/01/15 Python
详解通过HTML5 Canvas实现图片的平移及旋转变化的方法
2016/03/22 HTML / CSS
浅析HTML5中的download属性使用
2019/03/13 HTML / CSS
小橄榄树:Le Petit Olivier
2018/04/23 全球购物
Crocs波兰官方商店:女鞋、男鞋、童鞋、洞洞鞋
2019/10/08 全球购物
最新大学生自我评价
2013/09/24 职场文书
临床医师专业个人自我评价范文
2013/11/07 职场文书
中介业务员岗位职责
2014/04/09 职场文书
区域销售主管岗位职责
2014/06/15 职场文书
关于环保的活动方案
2014/08/25 职场文书
Python绘制地图神器folium的新人入门指南
2021/05/23 Python
前端监听websocket消息并实时弹出(实例代码)
2021/11/27 Javascript
MySQL远程无法连接的一些常见原因总结
2022/09/23 MySQL