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 相关文章推荐
setTimeout 不断吐食CPU的问题分析
Apr 01 Javascript
div移动 输入框不能输入的问题
Nov 19 Javascript
JavaScript设计模式之外观模式介绍
Dec 28 Javascript
JS实现文字放大效果的方法
Mar 03 Javascript
JavaScript中的Object对象学习教程
May 20 Javascript
Javascript+CSS3实现进度条效果
Oct 28 Javascript
第一次接触神奇的前端框架vue.js
Dec 01 Javascript
jquery hover 不停闪动问题的解决方法(亦为stop()的使用)
Feb 10 Javascript
BootStrap表单宽度设置方法
Mar 10 Javascript
Vue 使用formData方式向后台发送数据的实现
Apr 14 Javascript
javascript原型链学习记录之继承实现方式分析
May 01 Javascript
Openlayers实现地图的基本操作
Sep 28 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写的小东西
2006/12/06 PHP
ZF等常用php框架中存在的问题
2008/01/10 PHP
PHP连接MSSQL方法汇总
2016/02/05 PHP
jquery中dom操作和事件的实例学习-表单验证
2011/11/30 Javascript
使用JQuery和CSS模拟超链接的用户单击事件的实现代码
2012/05/23 Javascript
uploadify 3.0 详细使用说明
2012/06/18 Javascript
JavaScript之IE的fireEvent方法详细解析
2013/11/20 Javascript
基于Bootstrap重置输入框内容按钮插件
2016/05/12 Javascript
Angular.js之作用域scope'@','=','&amp;'实例详解
2017/02/28 Javascript
ES6新特性二:Iterator(遍历器)和for-of循环详解
2017/04/20 Javascript
JavaScript实现跟随滚动缓冲运动广告框
2017/07/15 Javascript
AngularJS+Bootstrap3多级导航菜单的实现代码
2017/08/16 Javascript
vue使用axios跨域请求数据问题详解
2017/10/18 Javascript
自定义vue组件发布到npm的方法
2018/05/09 Javascript
webpack 样式加载的实现原理
2018/06/12 Javascript
JavaScript跳出循环的三种方法(break, return, continue)
2019/07/30 Javascript
JS使用正则表达式判断输入框失去焦点事件
2019/10/16 Javascript
用Golang运行JavaScript的实现示例
2019/11/25 Javascript
JS 逻辑判断不要只知道用 if-else 和 switch条件判断(小技巧)
2020/05/27 Javascript
解决vue的router组件component在import时不能使用变量问题
2020/07/26 Javascript
Python实现多线程下载文件的代码实例
2014/06/01 Python
为Python程序添加图形化界面的教程
2015/04/29 Python
Python判断值是否在list或set中的性能对比分析
2016/04/16 Python
Python画图学习入门教程
2016/07/01 Python
Python中支持向量机SVM的使用方法详解
2017/12/26 Python
通过celery异步处理一个查询任务的完整代码
2019/11/19 Python
Tensorflow 实现将图像与标签数据转化为tfRecord文件
2020/02/17 Python
Python生成器next方法和send方法区别详解
2020/05/30 Python
Python如何创建装饰器时保留函数元信息
2020/08/07 Python
python 获取域名到期时间的方法步骤
2021/02/10 Python
HTML5 语音搜索只需一句代码
2013/01/03 HTML / CSS
印尼购物网站:iLOTTE
2019/10/16 全球购物
办理信用卡工作证明
2014/09/30 职场文书
农村环境卫生倡议书
2015/04/29 职场文书
《清澈的湖水》教学反思
2016/02/17 职场文书
Python之matplotlib绘制折线图
2022/04/13 Python