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 相关文章推荐
js弹窗代码 可以指定弹出间隔
Jul 03 Javascript
js新闻滚动 js如何实现新闻滚动效果
Jan 07 Javascript
jsPDF生成pdf后在网页展示实例
Jan 16 Javascript
js登录弹出层特效
Mar 07 Javascript
js/jquery判断浏览器的方法小结
Sep 02 Javascript
jquery+html5制作超酷的圆盘时钟表
Apr 14 Javascript
javascript运算符——逻辑运算符全面解析
Jun 27 Javascript
jQuery查找节点并获取节点属性的方法
Sep 09 Javascript
值得分享的Bootstrap Table使用教程
Nov 23 Javascript
node.js平台下的mysql数据库配置及连接
Mar 31 Javascript
layer.prompt使文本框为空的情况下也能点击确定的方法
Sep 24 Javascript
vue图片裁剪插件vue-cropper使用方法详解
Dec 16 Vue.js
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
ADODB结合SMARTY使用~超级强
2006/11/25 PHP
PHP实现变色验证码实例
2014/01/06 PHP
神盾加密解密教程(三)PHP 神盾解密工具
2014/06/08 PHP
php防止网站被攻击的应急代码
2015/10/21 PHP
php同时使用session和cookie来保存用户登录信息的实现代码
2016/05/13 PHP
Javascript valueOf 使用方法
2008/12/28 Javascript
15款优秀的jQuery导航菜单插件分享
2011/07/19 Javascript
jquery简单瀑布流实现原理及ie8下测试代码
2013/01/23 Javascript
node.js中的buffer.slice方法使用说明
2014/12/10 Javascript
node.js中的buffer.toString方法使用说明
2014/12/14 Javascript
JS清除选择内容的方法
2015/01/29 Javascript
jquery渐隐渐显的图片幻灯闪烁切换实现方法
2015/02/26 Javascript
JS自定义选项卡函数及用法实例分析
2015/09/02 Javascript
JavaScript中通过提示框跳转页面的方法
2016/02/14 Javascript
原生js实现可拖动的登录框效果
2017/01/21 Javascript
分分钟玩转Vue.js组件(二)
2017/03/01 Javascript
详解js类型判断
2018/05/22 Javascript
React Native基础入门之调试React Native应用的一小步
2018/07/02 Javascript
vue.draggable实现表格拖拽排序效果
2018/12/01 Javascript
mpvue全局引入sass文件的方法步骤
2019/03/06 Javascript
vue动画效果实现方法示例
2019/03/18 Javascript
react用Redux中央仓库实现一个todolist
2019/09/29 Javascript
[07:54]DOTA2 MV《我的动力鞋》 ImbaTV 出品
2014/11/21 DOTA
python抓取网页内容示例分享
2014/02/24 Python
Python编程django实现同一个ip十分钟内只能注册一次
2017/11/03 Python
python3实现163邮箱SMTP发送邮件
2018/05/22 Python
python中字符串内置函数的用法总结
2018/09/13 Python
Python破解BiliBili滑块验证码的思路详解(完美避开人机识别)
2020/02/17 Python
墨西哥运动服饰和鞋网上商店:Netshoes墨西哥
2016/07/28 全球购物
澳大利亚家具和家居用品购物网站:Zanui
2018/12/29 全球购物
JD Sports丹麦:英国领先的运动时尚零售商
2020/11/24 全球购物
电气自动化大学生求职信
2013/10/16 职场文书
专营店会计助理岗位职责
2013/11/29 职场文书
继电保护工岗位职责
2014/01/05 职场文书
运动会开幕式主持词
2014/03/28 职场文书
为Centos安装指定版本的Docker
2022/04/01 Servers