zoukankan      html  css  js  c++  java
  • select控件

    语法解释:
    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
    5. $("#select_id option[text='4']").remove();  //删除Select中Text='4'的Option
     
     

    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><option value='2'>2222</option>").appendTo("#sel")//添加下拉框的option 
                    $("#sel").empty();//清空下拉框

    ----------------------------------------------------------------------------------------------------

    //遍历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();//清空下拉框

    $("#selectID option[value='${labcaseSection}']").attr("selected", true);   //设置Select的value值为上次的项选中

    PS:select并不是input控件,别复制黏贴find("input[name='stationSelect']")就忘了修改类型了,应该为find("select[name='stationSelect']")

    转自:http://usenrong.iteye.com/blog/1106995

    人总要去积累生活、工作上的点点滴滴,慢慢的进步,以后回头看看,笑笑,顺便学学,人都说回忆才是最美的。
  • 相关阅读:
    sublime text 4 vim 插件配置
    ssh-keygen 的使用
    distribution transaction solution
    bilibili 大数据 视频下载 you-get
    Deepin 20.2.1 安装 MS SQL 2019 容器版本
    【转】使用Linux下Docker部署MSSQL并加载主机目录下的数据库
    【转】You Can Now Use OneDrive in Linux Natively Thanks to Insync
    dotnet 诊断工具安装命令
    Linux 使用 xrandr 设置屏幕分辨率
    【转】CentOS 7.9 2009 ISO 官方原版镜像下载
  • 原文地址:https://www.cnblogs.com/jueye/p/3096532.html
Copyright © 2011-2022 走看看