`
angelbill3
  • 浏览: 252885 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
社区版块
存档分类
最新评论

jQuery对select操作小结[转]

阅读更多
//遍历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,单选框:
取值:
var searchtype = $('input[name="searchtype"]:checked').val();
取值name为searchtype的一组被选中的radio值。
$("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的项目为当前选中项
            $("<option value='1'>1111</option><optionvalue='2'> 2222</option>").appendTo("#sel")//添加下拉框的option
            $("#sel").empty();//清空下拉框
分享到:
评论

相关推荐

    浅析jQuery对select操作小结(遍历option,操作option)

    本篇文章是关于jQuery对select的操作进行了总结介绍,需要的朋友可以参考下

    jQuery Select下拉框操作小结(推荐)

    jQuery获取Select元素,并选择的Text和Value: 1. $(“#select_id”).change(function(){//code…}); //为Select添加事件,当选择其中一项时触发 2. var checkText=$(“#select_id”).find(“option:selected”)....

    jQuery select操作控制方法小结

    很多朋友对jquery select的操作很有兴趣,但网上的东西太多,所以脚本之家特别将Jquery Select操作方法整理下,方便大家查找。

    jquery操作select option 的代码小结

    jquery操作select option 的代码小结,需要的朋友可以参考下。

    jQuery 技巧小结

    注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是jquery对象。 普通的dom对象一般可以通过$()转换成jquery对象。 如:$(document.getElementById(“msg”))则为jquery对象,可以使用jquery...

    jQuery操作表单常用控件方法小结

    下面的JS代码列出了jQuery操作表单常用控件(包括select,radiobox,checkbox)的常用方法,相信一定有你需要的 操作radio的html代码 Radion &lt;input type="radio" name="rd" id="rd1" checked="checked" value=...

    jquery对单选框,多选框,文本框等常见操作小结

    一、文本框、单选按钮、复选框、相关操作 代码如下:var sex=$(“input[name=’sex’]:checked”).val(); //获取一组radio被选中项的值 var item=$(“#sel option:selected”).text(); //获取select被选中项的文本...

    jQuery语法小结(超实用)

    注意dom对象和jquery对象是有区别的,调用方法时要注意操作的是dom对象还是jquery对象。  普通的dom对象一般可以通过$()转换成jquery对象。  如:$(document.getElementById(“msg”))则为jquery对象,可以使用...

    jquery的checkbox,radio,select等方法小结

    jquery的checkbox,radio,和select是jquery操作的一个难点和重点,很多前端新手对其了解不是很透彻。时间久了不用,我在写的时候有时也难免对某些操作支支吾吾,记不清楚,现在,对其做一些简单的总结

    jQuery攻略.pdf

    7 1.8 改变DOM节点的内容 8 1.9 快速创建DOM节点 9 1.10 为不同HTML元素分配相同类名并对它们应用样式 12 1.11 小结 13 第2章 数组和字符串 14 2.1 利用数组在列表中显示名字 14 2.2 操作数组元素 17 2.3 筛选数组...

    2013年优秀jQuery插件整理小结

    今天为大家推荐的是2013年的第一期,在这期里面十个jQuery插件涵盖了响应式的网格布局插件、图片放大插件、表单元素中自定义select插件,google 地图插件、文件拖放上传插件、tooltip提示插件、3D旋转菜单等等。...

    jQuery获取及设置表单input各种类型值的方法小结

    本文实例讲述了jQuery获取及设置input各种类型值的方法。分享给大家供大家参考,具体如下: 获取一组radio被选中项的值 var item = $(input[@name=items]:checked).val(); 获取select被选中项的文本 var item = ...

    JQuery 文本框使用小结

    1。文本框的改变事件,可使用propertychange,例如: 代码...下拉列表的改变事件,以及获得选中选项的值 代码如下: $(“#下拉列表”).change(function() { //获得选中项的值 var select = $(this).val(); }).change();

    jQuery语法总结和注意事项小结

    一、简介 1.1、概述 随着WEB2.0及ajax思想在互联网上的快速发展传播,陆续出现了一些优秀的Js框架,其中比较著名的有Prototype、YUI、jQuery、mootools、Bindows以及国内的JSVM框架等,通过将这些JS框架应用到我们的...

Global site tag (gtag.js) - Google Analytics