当前位置: 首页 > 编程笔记 >

Jquery对select的增、删、改、查操作

漆雕恺
2023-03-14
本文向大家介绍Jquery对select的增、删、改、查操作,包括了Jquery对select的增、删、改、查操作的使用技巧和注意事项,需要的朋友参考一下

逃不开传统的四种操作:增、删、改、查。

<四处搜刮了jquery对select操作的代码,汇集一下,方便以后查看。日历天数变化代码为原创。>

[增]:


$("#select_id").append("<option value='Value'>Text</option>"); //为Select追加一个Option(下拉项) 

$("#select_id").prepend("<option value='0'>请选择</option>"); //为Select插入一个Option(第一个位置) 

[删]:


$("#select_id option:last").remove(); //删除Select中索引值最大Option(最后一个) 

$("#select_id option[index='0']").remove(); //删除Select中索引值为0的Option(第一个) 

$("#select_id option[value='3']").remove(); //删除Select中Value='3'的Option 

$("#select_id option[text='4']").remove(); //删除Select中Text='4'的Option 

$("#select_id").empty(); //清空

[改](设置选中项):


$("#select_id ").get(0).selectedIndex=1; //设置Select索引值为1的项选中 

$("#select_id ").val(4); //设置Select的Value值为4的项选中 

$("#select_id option[text='jQuery']").attr("selected", true); //设置Select的Text值为jQuery的项选中 

[查](获取选中值):

1.获取选中项的value


$("#select_id").val(); //获取选中项的value

$("#select_id ").get(0).selectedIndex; //获取选中项的索引值

$("#select_id").find("option:selected").text(); //获取选中项的text

$("#select_id option:last").attr("index"); //获取Select最大的索引值 

附上代码样例,代码功能为根据实际选择的“年”、“月”,来改变select“日”中option的天数。

使用php编写,默认$("select.day")初始有31天,因为默认为1月:


<select name ="date_year" class="year"> //年

    <?php 

    for ($year = 1990; $year <= date("Y"); ++$year) {

    ?>

        <option value="<?php echo $year;?>"><?php echo $year;?></option>

    <?php

    }

    ?>

</select>


<select name ="date_month" class="month"> //月

    <?php

    for ($month = 1; $month <= 12; ++$month) {

    ?>

        <option value="<?php echo $month;?>"><?php echo $month;?></option>

    <?php

    }

    ?>

</select>


<select name ="date_day" class="day"> //日

    <?php

    for ($day = 1; $day <= 31; ++$day) {

    ?>

        <option value="<?php echo $day;?>"><?php echo $day;?></option>

     <?php

     }

     ?>

</select>

jquery代码:


$(document).ready(function() {

    $("select.month, select.year").change(function() { //"年"、"月"的变化都可能引起“日”的变化

        $("select.day").empty(); //非常重要,要先清空

        for (var i = 1; i < 31; i++) {

            var option = $("<option>").val(i).text(i);

            $("select.day").append(option);

        }

        var month = $("select.month").val();

        if ((month % 2 && month < 8) || (month % 2 === 0 && month > 7)) {

            $("select.day").append("<option value='31'>31</option>"); //天数为31天的append一个option

        }

        if (month === 2) { 

            $("select.day option:last").remove();

            $("select.day option:last").remove(); //2月天数28

            var year = $("select.year").val();

            if ((year % 4 === 0 && year % 100) || year % 400 === 0)

                $("select.day").append("<option value='29'>29</option>"); //闰年2月天数加一

        }

    });

});

以上就是关于jQuery实现对select的增、删、改、查操作总结,希望大家能够喜欢。

 类似资料:
  • 主要内容:插入记录,修改记录,删除记录,查询数据接下来,我们将介绍 Hibernate 是如何实现对数据库的增删改查(CRUD)操作的。 插入记录 Hibernate 在 Session 接口中为我们提供了一个 save() 方法,该方法可以向据库表中插入记录。 1. 在测试类 MyTest 中,创建一个名称为 testInsert 的方法,代码如下。 2. 运行测试方法 testInsert(),控制台输出如下。 3. 查询数据库 user

  • 一、前言 在第二章《Memcached源码分析 - Memcached源码分析之命令解析(2)》 和第三章《Memcached源码分析 - Memcached源码分析之消息回应(3)》 中我们主要通过Memcached的get命令,分析了Memcached的命令解析和消息回应的模块功能。这一章,我们主要来详细看一下Memcached常用的增删改查操作。 在看Memcached的增删改查操作前,我们

  • 本文向大家介绍node.js操作mysql(增删改查),包括了node.js操作mysql(增删改查)的使用技巧和注意事项,需要的朋友参考一下 最近这段时间研究Node感觉不错,自己做了一个增删改查,虽然有些简陋,但是思想是想通的,其实所有项目都是增删改查,有助于初学者快速掌握Node  首先 本实例展示的是基于Node+Express+node-mysql快速搭建的一套增删改查,视图模板是jad

  • 本文向大家介绍jQuery对table表格进行增删改查,包括了jQuery对table表格进行增删改查的使用技巧和注意事项,需要的朋友参考一下 最近要处理一些前端的工作,重新学习了一下jQuery,感觉还是那么的锋利啊!!! 总结了一下对table的增删改查,写一篇留着以后自己recode。 1.首先我自己写了一个简单的div布局。 2.实现几个用<a>标签做的按钮的功能 分别是新增 修改 删除

  • 本文向大家介绍hibernate增删改查操作代码,包括了hibernate增删改查操作代码的使用技巧和注意事项,需要的朋友参考一下 Hibernate对数据删除操作 删除User表中个一条数据,是需要更具User表的主键id值来删除的。首先根据id值向数据库中查询出来对应的对象。可以采用两种方式一是session的get方法,一个是session的load方法。 Session的Get方法:调用这

  • 本文向大家介绍jQuery增加、删除及修改select option的方法,包括了jQuery增加、删除及修改select option的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了jQuery增加、删除及修改select option的方法。分享给大家供大家参考,具体如下: jQuery获取Select选择的Text和Value: 1. 2. 3. 4. jQuery添加/删除S