JQuery 常用操作代码


Posted in Javascript onMarch 14, 2010

//遍历option和添加、移除option
function changeShipMethod(shipping){

var len = $("select[@name=ISHIPTYPE] option").length

if(shipping.value != "CA"){

$("select[@name=ISHIPTYPE] option").each(function(){

if($(this).val() == 111){

$(this).remove();

}

});

}
else

{

$("<option value='111'>UPS Ground</option>").appendTo($("select[@name=ISHIPTYPE]"));
  }
}

//取得下拉选单的选取值

$(#testSelect option:selected').text();
或$("#testSelect").find('option:selected').text();
或$("#testSelect").val();
//////////////////////////////////////////////////////////////////
记性不好的可以收藏下:
1,下拉框:

var cc1 = $(".formc select[@name='country'] option[@selected]").text(); //得到下拉菜单的选中项的文本(注意中间有空格)
var cc2 = $('.formc select[@name="country"]').val(); //得到下拉菜单的选中项的值
var cc3 = $('.formc select[@name="country"]').attr("id"); //得到下拉菜单的选中项的ID属性值
$("#select").empty();//清空下拉框//$("#select").html('');
$("<option value='1'>1111</option>").appendTo("#select")//添加下拉框的option

稍微解释一下:
1.select[@name='country'] option[@selected] 表示具有name 属性,
并且该属性值为'country' 的select元素 里面的具有selected 属性的option 元素;
可以看出有@开头的就表示后面跟的是属性。

2,单选框:
$("input[@type=radio][@checked]").val(); //得到单选框的选中项的值(注意中间没有空格)
$("input[@type=radio][@value=2]").attr("checked",'checked'); //设置单选框value=2的为选中状态.(注意中间没有空格)

3,复选框:
$("input[@type=checkbox][@checked]").val(); //得到复选框的选中的第一项的值
$("input[@type=checkbox][@checked]").each(function(){ //由于复选框一般选中的是多个,所以可以循环输出
alert($(this).val());
});

$("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined){} //判断是否已经打勾

当然jquery的选择器是强大的. 还有很多方法.

<script src="jquery-1.2.1.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(document).ready(function(){
$("#selectTest").change(function()
{
//alert("Hello");
//alert($("#selectTest").attr("name"));
//$("a").attr("href","xx.html");
//window.location.href="xx.html";
//alert($("#selectTest").val());
alert($("#selectTest option[@selected]").text());
$("#selectTest").attr("value", "2");

});
});
</script>

<a href="#">aaass</a>

<!--下拉框-->
<select id="selectTest" name="selectTest">
<option value="1">11</option>
<option value="2">22</option>
<option value="3">33</option>
<option value="4">44</option>
<option value="5">55</option>
<option value="6">66</option>
</select>
jquery radio取值,checkbox取值,select取值,radio选中,checkbox选中,select选中,及其相关获取一组radio被选中项的值
var item = $('input[@name=items][@checked]').val();
获取select被选中项的文本
var item = $("select[@name=items] option[@selected]").text();
select下拉框的第二个元素为当前选中值
$('#select_id')[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$('input[@name=items]').get(1).checked = true;
获取值:
文本框,文本区域:$("#txt").attr("value");
多选框checkbox:$("#checkbox_id").attr("value");
单选组radio: $("input[@type=radio][@checked]").val();
下拉框select: $('#sel').val();
控制表单元素:
文本框,文本区域:$("#txt").attr("value",'');//清空内容
$("#txt").attr("value",'11');//填充内容
多选框checkbox: $("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾
单选组radio: $("input[@type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项
下拉框select: $("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项
$("<optionvalue='1'>1111</option><optionvalue='2'>2222</option>").appendTo("#sel")//添加下拉框的option
$("#sel").empty();//清空下拉框

获取一组radio被选中项的值
var item = $('input[@name=items][@checked]').val();
获取select被选中项的文本
var item = $("select[@name=items] option[@selected]").text();
select下拉框的第二个元素为当前选中值
$('#select_id')[0].selectedIndex = 1;
radio单选组的第二个元素为当前选中值
$('input[@name=items]').get(1).checked = true;
获取值:
文本框,文本区域:$("#txt").attr("value");
多选框checkbox:$("#checkbox_id").attr("value");
单选组radio: $("input[@type=radio][@checked]").val();
下拉框select: $('#sel').val();
控制表单元素:
文本框,文本区域:$("#txt").attr("value",'');//清空内容
$("#txt").attr("value",'11');//填充内容
多选框checkbox: $("#chk1").attr("checked",'');//不打勾
$("#chk2").attr("checked",true);//打勾
if($("#chk1").attr('checked')==undefined) //判断是否已经打勾
单选组radio: $("input[@type=radio]").attr("checked",'2');//设置value=2的项目为当前选中项
下拉框select: $("#sel").attr("value",'-sel3');//设置value=-sel3的项目为当前选中项
$("<option value='1'>1111</option><option value='2'>2222</option>").appendTo("#sel")//添加下拉框的option
$("#sel").empty();//清空下拉框

jquery 常用操作整理基础入门篇

jquery select(列表)的操作(取值/赋值)

Javascript 相关文章推荐
Jquery乱码的一次解决过程 图解教程
Feb 20 Javascript
javascript改变position值实现菜单滚动至顶部后固定
Jan 18 Javascript
javascript实现带下拉子菜单的导航菜单效果
May 14 Javascript
js实现圆盘记速表
Aug 03 Javascript
js实现YouKu的漂亮搜索框效果
Aug 19 Javascript
jQuery插件ajaxFileUpload异步上传文件
Oct 19 Javascript
jquery表单验证实例仿Toast提示效果
Mar 03 Javascript
angularjs+bootstrap菜单的使用示例代码
Mar 07 Javascript
javascript 判断一个对象为数组的方法
May 03 Javascript
BACKBONE.JS 简单入门范例
Oct 17 Javascript
微信小程序数据存储与取值详解
Jan 30 Javascript
详解vue.js下引入百度地图jsApi的两种方法
Jul 27 Javascript
Jquery Ajax学习实例 向页面发出请求,返回XML格式数据
Mar 14 #Javascript
Jquery cookie操作代码
Mar 14 #Javascript
javascript 解决表单仍然提交即使监听处理函数返回false
Mar 14 #Javascript
jQuery第三课 修改元素属性及内容的代码
Mar 14 #Javascript
jQuery 第二课 操作包装集元素代码
Mar 14 #Javascript
jQuery入门第一课 jQuery选择符
Mar 14 #Javascript
使用JavaScript switch case 另类写法
Mar 14 #Javascript
You might like
php上传、管理照片示例
2006/10/09 PHP
PHP数组无限分级数据的层级化处理代码
2012/12/29 PHP
php写的AES加密解密类分享
2014/06/20 PHP
详解PHP中的8个魔术常量
2020/07/06 PHP
FLASH 广告之外的链接
2008/12/16 Javascript
js取消单选按钮选中示例代码
2013/11/14 Javascript
jQuery中的height innerHeight outerHeight区别示例介绍
2014/06/15 Javascript
如何防止JavaScript自动插入分号
2015/11/05 Javascript
vue.js表格分页示例
2016/10/18 Javascript
js学习总结之dom2级事件基础知识详解
2017/07/27 Javascript
Vue.js实现实例搜索应用功能详细代码
2017/08/24 Javascript
用Cordova打包Vue项目的方法步骤
2019/02/02 Javascript
深入webpack打包原理及loader和plugin的实现
2020/05/06 Javascript
Python中zip()函数用法实例教程
2014/07/31 Python
Python读写文件方法总结
2015/06/09 Python
python2 与python3的print区别小结
2018/01/16 Python
用python一行代码得到数组中某个元素的个数方法
2019/01/28 Python
python 获取sqlite3数据库的表名和表字段名的实例
2019/07/17 Python
python爬取百度贴吧前1000页内容(requests库面向对象思想实现)
2019/08/10 Python
详解Python self 参数
2019/08/30 Python
python+selenium 脚本实现每天自动登记的思路详解
2020/03/11 Python
如何将tensorflow训练好的模型移植到Android (MNIST手写数字识别)
2020/04/22 Python
Python爬虫爬取糗事百科段子实例分享
2020/07/31 Python
Python+OpenCV图像处理—— 色彩空间转换
2020/10/22 Python
CSS3打造百度贴吧的3D翻牌效果示例
2017/01/04 HTML / CSS
详解canvas多边形(蜘蛛图)的画法示例
2018/01/29 HTML / CSS
澳大利亚最受欢迎的美发和美容在线商店:Catwalk
2018/12/12 全球购物
智能钱包:Ekster
2019/11/21 全球购物
英国领先的男装设计师服装独立零售商:Repertoire Fashion
2020/10/19 全球购物
市场部业务员岗位职责
2014/04/02 职场文书
读书活动总结
2014/04/28 职场文书
群众路线教育实践活动对照检查材料思想汇报(副处级领导)
2014/10/04 职场文书
2015年加油站工作总结
2015/05/13 职场文书
2016年小学生新年寄语
2015/08/18 职场文书
Redis 操作多个数据库的配置的方法实现
2022/03/23 Redis
mysql insert 存在即不插入语法说明
2022/03/25 MySQL