转载请注明出处。

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

<四处搜刮了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的操作(附日历天数变化代码)的更多相关文章

  1. 【jq】JQuery对select的操作

    下拉框 <select id="selectID" name="selectName"> <option vlaue="1" ...

  2. jQuery关于Select的操作

    jQuery获取Select选择的Text和Value: 1. var checkText=jQuery("#select_id").find("option:selec ...

  3. jQuery的select相关操作

    例: <select class="selector" id="selector"></select> 1.设置value为pxx的项选 ...

  4. jquery的select 2库,如果用js代码刷新选项?

    遇到的需求,select的显示为select 2的样式. 那如果用户全选时,如何能让select 2的样式更新呢? 1,引入select 2 $(".select2_single" ...

  5. jQuery select的操作代码

    jQuery對select的操作的实际应用代码. //改變時的事件  复制代码代码如下: $("#testSelect").change(function(){ //事件發生  j ...

  6. jQuery对Select操作大集合

    介绍了jQuery对Select的操作进行了详细的汇总. 1.jQuery添加/删除Select的Option项: 2.$("#select_id").append("& ...

  7. JQuery 对 Select option 的操作---转载

    <select id="selectID" > <option value="1">1</option> <optio ...

  8. jquery获得select option的值和对select option的操作

    <body> <select name="month" id="selMonth" onchange="set()"> ...

  9. jquery select 常用操作总结

    由于在项目各种所需,经常碰到select不种操作的要求,今天特意总结了一下,分享: jQuery获取Select选择的Text和Value: 语法解释: 1. $("#select_id&q ...

随机推荐

  1. [Java 8 Lambda] java.util.stream 简单介绍

    包结构例如以下所看到的: 这个包的结构非常easy,类型也不多. BaseStream接口 全部Stream接口类型的父接口,它继承自AutoClosable接口,定义了一些全部Stream都具备的行 ...

  2. IHttpModule与IHttpHandler的区别整理

    IHttpModule与IHttpHandler的区别整理1.先后次序.先IHttpModule,后IHttpHandler. 注:Module要看你响应了哪个事件,一些事件是在Handler之前运行 ...

  3. 编写可维护的JS 04

    4.变量.函数和运算符 变量 变量声明提前,单var 函数声明 先声明fn再执行 函数声明不应出现在语句块中 函数调用间隔 函数名与左括号间无间隔 立即调用函数 (fuction(){}) 严格模式  ...

  4. JavaScript之对象学习

    对象是一种非常重要的数据类型,他是一种自包含的数据集合,包含在对象里面的数据可以通过属性和方法两种形式来访问; 1.属性是隶属于某个特定对象的变量; 2.方法是只有某个特定对象才能调用的函数; 而对象 ...

  5. 8月9日,PS、计算机基础(预科)

    一.   PS         掌握简单的图标修改. 1.图层                 2.保存PSD格式,有图层:JPG格式,没有图层.                 3.魔棒工具(调整值 ...

  6. Httpservlet cannot be resolved to a type

    这个问题与上个问题可以说是“错的类似”.解决方案:就是在Tomcat的lib目录下加入servlet-api.jar 即可.

  7. ASP.Net中使用Report Service

    昨天研究以下Report Service,发现SQL Service自带的报表服务器也非常强大, 一,报表在不同的应用中表现形式 参考:http://www.cnitblog.com/yide/arc ...

  8. 如何为你的美术妹子做Unity的小工具(二)

    你想像这样一样  为自己的Unity 小工具打开一个Unity的窗口吗?   看起来就很厉害对不对   妹子看了还不激动吗 ?!

  9. apache+mysql+php环境的手动搭建

    一.搭建Apache Http Server 官方下载地址:http://www.apachehaus.com/cgi-bin/download.plx 搭建环境:win10 64位 WIN10 64 ...

  10. java 中有几种方法可以实现一个线程? 用什么关键字修 饰同步方法? stop()和 suspend()方法为何不推荐使用?

    java5 以前, 有如下两种:第一种:new Thread(){}.start();这表示调用 Thread 子类对象的 run 方法, new Thread(){}表示一个Thread 的匿名子类 ...