zoukankan      html  css  js  c++  java
  • JQuery 对 Select option 的操作

    下拉框:

    复制代码
    <select id="selectID" >
            <option value="1">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
            <option value="6">6</option>
        </select>
     
    复制代码

     下面是对下拉框的基本操作:

    复制代码
    <script language="javascript">
            $(document).ready(function() {
            //绑定下拉框change事件,当下来框改变时调用 SelectChange()方法
            $("#selectID").change(function() { SelectChange(); }); 
            })
            function SelectChange() {
            //获取下拉框选中项的text属性值
            var selectText = $("#selectID").find("option:selected").text();
            alert(selectText);
            //获取下拉框选中项的value属性值
            var selectValue = $("#selectID").val();
            alert(selectValue);
            //获取下拉框选中项的index属性值
            var selectIndex = $("#selectID").get(0).selectedIndex;
            alert(selectIndex);
            ////获取下拉框最大的index属性值
            var selectMaxIndex = $("#selectID option:last").attr("index");
            alert(selectMaxIndex);
        }

        function aa() {
            //设置下拉框index属性为5的选项 选中
            $("#selectID").get(0).selectedIndex = 5;  
        }
        function bb() {
            //设置下拉框value属性为4的选项 选中
            $("#selectID").val(4);
        }
        function cc() {
            //设置下拉框text属性为5的选项 选中
             $("#selectID option[text=5]").attr("selected", "selected");
             $("#yyt option:contains('5')").attr("selected", true);
        }
        function dd() {
            //在下拉框最后添加一个选项
            $("#selectID").append("<option value='7'>7</option>");
        }
        function ee() {
            //在下拉框最前添加一个选项
            $("#selectID").prepend("<option value='0'>0</option>")
        }
        function ff() {
            //移除下拉框最后一个选项
            $("#selectID option:last").remove();
        }

        function gg() {
            //移除下拉框 index属性为1的选项
            $("#selectID option[index=1]").remove();
        }

        function hh() {
            //移除下拉框 value属性为4的选项
            $("#selectID option[value=4]").remove();
        }
        function ii() {
            //移除下拉框 text属性为5的选项
            $("#selectID option[text=5]").remove();
        }    
        </script>
  • 相关阅读:
    Windows Server 2012配置开机启动项
    Windows Server 2019 SSH Server
    NOIP2017 senior A 模拟赛 7.7 T1 棋盘
    Noip 2015 senior 复赛 Day2 子串
    Noip 2015 senior复赛 题解
    Noip 2014 senior Day2 解方程(equation)
    Noip 2014 senior Day2 寻找道路(road)
    Noip 2014 senior Day2 无线网络发射器选址(wireless)
    Noip2014senior复赛 飞扬的小鸟
    Noip 2014 senior 复赛 联合权值(link)
  • 原文地址:https://www.cnblogs.com/Joans/p/4994025.html
Copyright © 2011-2022 走看看