zoukankan      html  css  js  c++  java
  • select下拉框之JS/JQuery详细操作

    下拉框的操作一直是我比较困扰的地方,以下将分别对js和jquery的操作进行比较性的说明。总结中也学习到了一些JQuery方法的使用技巧。

    var sel_obj = 下拉框DOM对象

    var $sel_obj = 下拉框JQuery对象

    一、移除


    1. 移除所有项:

      sel_obj.options.length = 0;

      $sel_obj.empty();

    .empty()” 从被选元素移除所有内容,包括所有文本和子节点,保留其在dom中所占的位置

    2. 移除下拉框中的一项:
      sel_obj.options.remove(index); 

    index”为下拉框选项的索引值,若0索引项移出(自上而下),那么1索引项的索引会变为0,后面的索引依次向前推进

      移除所有项:(注意:倒循环)  

    for(len=sel_obj.options.length, var i=len-1, ;i>=0;i--){
    
        sel_obj.options.remove(i); 
    }

      $sel_obj.find("option").eq(index).remove();

    .remove()” 从被选元素移除所有内容,包括所有文本和子节点,保留其在dom中所占的位置,这点与“.empty()”有所区别

    二、添加


      sel_obj.options.add(new Option("text", "value"));

    text”为下拉框选项的显示文本,“value”为下拉框选项的值,在下拉框末尾添加,索引值最大

      $sel_obj.append("<option value='value'>text</option>");

      $sel_obj.prepend("<option value='value'>text</option>");

    “.append()”在下拉框末尾添加,添加后此项索引值最大; “.prepend()”在下拉框的首部添加,添加后此项索引值为0

    四、获取


    1. 获取下拉框选中项的值:
      sel_obj.options[sel_obj.selectedIndex].value;

      $sel_obj.val();

    2. 获取下拉框选中项的文本:
      sel_obj.options[sel_obj.selectedIndex].innerText;

      $sel_obj.find("option:selected").text();

    option:selected”为选中项,“option:first”为首项(索引值为0),“option:last”为末项(索引值最大)

    3. 获取下拉框选中项的索引:
      sel_obj.selectedIndex;


      $sel_obj.prop("selectedIndex");

    .prop()”应该被用来处理boolean attributes/properties以及在html(比如:window.location)中不存在的properties。其他所有的attributes(在html中你看到的那些)可以而且应该继续使用“.attr()”方法来进行操作。

       例如:

    <select id="selId">
        <option value="a">AAA</option>
        <option value="b">BBB</option>
        <option value="c">CCC</option>
        <option value="e" selected="selected">EEE</option>
    </select>

      结果为3。

    五、判断


    1. 判断下拉框是否选中:

      sel_obj.selectedIndex > -1 ? //选中 //没有选中;

      $sel_obj.prop("selected") ? //选中 //没有选中;

    ★不是每一次努力都会有收获,但是每一次收获都必须努力,这是一个不公平的不可逆转的命题★
  • 相关阅读:
    Java动态代理详解
    (10) openssl dhparam(密钥交换)
    (9) openssl enc(对称加密)
    (8) openssl rsautl(签名/验证签名/加解密文件)和openssl pkeyutl(文件的非对称加密)
    (7) openssl dgst(生成和验证数字签名)
    (6) openssl passwd(生成加密的密码)
    (5) openssl speed(测试算法性能)和openssl rand(生成随机数)
    (4) openssl rsa/pkey(查看私钥、从私钥中提取公钥、查看公钥)
    (3) openssl genrsa(生成rsa私钥)
    (2) OpenSSL命令
  • 原文地址:https://www.cnblogs.com/lishaofei/p/3012786.html
Copyright © 2011-2022 走看看