Jquery操作radio,checkbox,select表单操作实现代码


一 、Select
jQuery获取Select选择的Text和Value:
1. $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发
2. var checkText=$("#select_id").find("option:selected").text(); //获取Select选择的Text
3. var checkValue=$("#select_id").val(); //获取Select选择的Value
4. var checkIndex=$("#select_id ").get(0).selectedIndex; //获取Select选择的索引值
5. var maxIndex=$("#select_id option:last").attr("index"); //获取Select最大的索引值

jQuery设置Select选择的Text和Value:
1. $("#select_id ").get(0).selectedIndex=1; //设置Select索引值为1的项选中
2. $("#select_id ").val(4); //设置Select的Value值为4的项选中
3. $("#select_id option[text='jQuery']").attr("selected", true); //设置Select的Text值为jQuery的项选中

jQuery添加/删除Select的Option项:
1. $("#select_id").append("<option value='Value'>Text</option>"); //为Select追加一个Option(下拉项)
2. $("#select_id").prepend("<option value='0'>请选择</option>"); //为Select插入一个Option(第一个位置)
3. $("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个)
4. $("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个)
5. $("#select_id option[value='3']").remove(); //删除Select中Value='3'的Option
6. $("#select_id option[text='4']").remove(); //删除Select中Text='4'的Option
7. $("#SelectID").remove(); //删除所有项

二、Checkbox
全选/取消
jQuery.attr 获取/设置对象的属性值,如:
$("input[name='chk_list']").attr("checked"); //读取所有name为'chk_list'对象的状态(是否选中)
$("input[name='chk_list']").attr("checked",true); //设置所有name为'chk_list'对象的checked为true
$("#img_1").attr("src","test.jpg"); //设置ID为img_1的<img>src的值为'test.jpg'
$("#img_1").attr("src"); //读取ID为img_1的<img>src值
下面的代码是获取上面实例中选中的checkbox的value值:
<script type="text/javascript">
var arrChk=$("input[name='chk_list'][checked]");
$(arrChk).each(function(){
window.alert(this.value);
});
});
</script>

1,获取checkbox的value
$("#checkboxID").value或$("input[type='checkbox']").eq(n).attr("checked").value
2,设置选中项
$("input[type='checkbox']").eq(1).attr("checked")//设置第一个checkbox为选中的项
3,删除所有checkbox
$("input[type='checkbox']").remove()
4,checkbox方法
$(document).ready(function() {
var check = $("input[type='checkbox']");
check.each(function(n) {
check.eq(n).bind("click", function() {
if (check.eq(n).attr("checked") != false) {
var value = check.eq(n).val();
alert(value);
}
else {
alert(check.eq(n).attr("checked"));
}
})
});
});

三、radio
1,获取选中的value值
$("input[type='radio']:checked").val();
2,设置指定的项为当前选中项
$("input[type='radio']").eq(1).attr("checked", true);//设置第二项为选中项
$("input[type='radio'][value='值']").attr("checked, true");

3,解决多个Radio

$("input[type='radio'][@name='rdoTest2']").eq(0).attr("checked", true);
学习笔记,以备后用。

运行以后,请刷新下才能看到效果,保存到本地运行,没有任何问题。


[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]



相关阅读:
静态图片的十一种滤镜效果--不支持Ie7及非IE浏览器。
纯语义化XHTML+CSS设计表单方法
計算你開發的 PHP 程式大小
sql2005 数据同步方法
使用TextRange获取输入框中光标的位
jquery绑定原理 简单解析与实现代码分享
firebug的一个有趣现象介绍
Oracle10gR2上遇到了Mutex竞争的问题
汇总整理MYSQL相关操作命令
FreeBSD 6.2-RELEASE下用freebsd-update升级过程
javascript表单之间的数据传递
什么是DOM(Document Object Model)文档对象模型
SQL Server注入的四种个人经验和技巧方法
ASP视频教程:后台功能的一些完善
快速导航
PHP MySQL HTML CSS JavaScript MSSQL AJAX .NET JSP Linux Mac ASP 服务器 SQL jQuery C# C++ java Android IOS oracle MongoDB SQLite wamp 交通频道 作文范文 祖国-母亲 姑娘,你很美好,但很多时候,这世界骗的就是你 中班美术教案:我给老师画张相 寒假社会实践论文_社会实践报告 淡淡的,月光 月球的奥秘读后感 临平道中 宽容之法 原来云离开风,一样可以幸福! 《王二小》读后感作文700字 梦之声450字 小学作文:成长的烦恼 几多繁华,终是换不回你 优秀入团申请书范文 牙齿的烦恼梅慧芸作文300字 愿岁月静好,你亦无恙 新版精卫填海 痛,写满天空(六)作文1300字 经典语录:从古到今,淡定的人,都是旁观者 小学四年级作文450字:为了爱.让我们飞吧! 魔鬼学校作文700字 两学一做学习教育笔记 基层民警工作心得体会 钓水鱼 小学生三好生竞选稿 2015工作报告格式范文 [古典吉他名人]当代吉他大师朱利安.布里简历 难忘恩师——胡晓辰作文400字 采访活动作文450字 企业精细化管理实施方案 悲伤作文1100字 生活因挫折更精彩作文700字 高中同学聚会主持词怎么写 2015故意伤害罪量刑标准 鱼在波涛下微笑 医生2016年个人工作总结 我养的小白兔 教授玩家钱文忠:左手生意,右手学术 品味人生,品味生活 QQ心情短语带图片:别矫情,这世上没有不带伤的人 企业节能减排年终工作总结 我最喜欢一诺千金这个成语 绿豆也会变紫 烟花真美丽 优秀班主任自我鉴定 悼念六年级作文400字 最新中考满分作文及点评 陈思念: 我赌输了,却赢了爱情。 突破性创新、互补性资产与企业竞争优势 别烦恼,亲爱的朋友

Copyright © 2016 phpStudy |