jQuery动态添加删除select项
// 添加
function col_add() {
var selObj = $("#mySelect");
var value="value";
var text="text";
selObj.append("<option value='"+value+"'>"+text+"</option>");
}
// 删除
function col_delete() {
var selOpt = $("#mySelect option:selected");
selOpt.remove();
}
// 清空
function col_clear() {
var selOpt = $("#mySelect option");
selOpt.remove();
}
以上方法为jQuery动态添加、删除和清空select。下面是纯js的写法:
var sid = document.getElementById("mySelect");
sid.options[sid.options.length]=new Option("text","value"); // 在select最后添加一项
其他常用的方法:
$("#mySelect").change(function(){//code...}); //select选中项改变时触发
// 获取select值
var text=$("#mySelect").find("option:selected").text(); //获取Select选中项的Text
var value=$("#mySelect").val(); //获取Select选中项的Value
var value=$("#mySelect option:selected").attr("value"); //获取Select选中项的Value
var index=$("#mySelect").get(0).selectedIndex; //获取Select选中项的索引值,从0开始
var index=$("#mySelect option:selected").attr("index"); //不可用!!!
var index=$("#mySelect option:selected").index(); //获取Select选中项的索引值,从0开始
var maxIndex=$("#mySelect option:last").attr("index"); //不可用!!!
var maxIndex=$("#mySelect option:last").index();//获取Select最大索引值,从0开始
$("#mySelect").prepend("<option value='value'>text</option>"); //Select第一项前插入一项
// 设置select值
//根据索引设置选中项
$("#mySelect").get(0).selectedIndex=index;//index为索引值
//根据value设置选中项
$("#mySelect").attr("value","newValue");
$("#mySelect").val("newValue");
$("#mySelect").get(0).value = value;
//根据text设置对应的项为选中项
var count=$("#mySelect option").length;
for(var i=0;i<count;i++)
{
if($("#mySelect").get(0).options[i].text == text)
{
$("#mySelect").get(0).options[i].selected = true;
break;
}
}
// 清空select
$("#mySelect").empty();
jQuery动态添加删除select项的更多相关文章
- jQuery动态添加删除CSS样式
jQuery框架提供了两个CSS样式操作方法,一个是追加样式addClass,一个是移除样式removeClass,下面通过一个小例子讲解用法. jQuery动态追加移除CSS样式 <!DOCT ...
- jquery动态添加删除div--事件绑定,对象克隆
我想做一个可以动态添加删除div的功能.中间遇到一个问题,最后在manong123.com开发文摘 版主的热心帮助下解答了(答案在最后) 使用到的jquery方法和思想就是:事件的绑定和销毁(unbi ...
- jQuery动态添加删除与添加表行代码
具体实现代码如下: table的HTML如下: 代码如下 复制代码 <input type="button" value="添加一行" />< ...
- jquery动态添加/删除 tr/td
<head runat="server"> <title></title> <!--easyui --> <link rel= ...
- ASP.NET+ashx+jQuery动态添加删除表格
aspx: <script src="../script/jquery-1.4.4.min.js" type="text/javascript" lang ...
- Jquery动态添加/删除表格行和列
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- Jquery动态添加 删除 操作实现
这是gridView为空数据时显示的表头 下面直接填代码: function Add() { //动态添加行 $("#gridCustomerView").append(" ...
- 浏览器后退按钮导致jquery动态添加的select option值丢失的解决方法
监控浏览器返回功能 判断浏览器返回功能 禁用浏览器的后退按钮 JS禁止浏览器后退键 http://volunteer521.iteye.com/blog/830522/ 浏览器返回功能 判断上一页面来 ...
- JS & JQuery 动态添加 select option
因为是转载文章 在此标明出处,以前有文章是转的没标明的请谅解,因为有些已经无法找到出处,或者与其它原因. 如有冒犯请联系本人,或删除,或标明出处. 因为好的文章,以前只想收藏,但连接有时候会失效,所以 ...
随机推荐
- Hibernate JPA中@Transient、@JsonIgnoreProperties、@JsonIgnore、@JsonFormat、@JsonSerialize等注解解释
@jsonignore的作用作用是json序列化时将java bean中的一些属性忽略掉,序列化和反序列化都受影响. http://www.cnblogs.com/toSeeMyDream/p/443 ...
- C++模板:文件操作
freopen("demo.in","r",stdin); freopen("demo.out","w",stdout) ...
- POJ 1655 - Balancing Act 树型DP
这题和POJ 3107 - Godfather异曲同工...http://blog.csdn.net/kk303/article/details/9387251 Program: #include&l ...
- JavaScript中的字符串
JavaScript字符串是JavaScript最重要的部分,可能比任何其他的数据类型都更多的用到. 所有的JavaScript对象共享的方法之一就是toString(). 字符串对象叫做String ...
- Javascript debugger come accross error
Problem: “Unable to attach to the process. Another debugger might be attached to the process.” Solut ...
- 使用超链接跳转页面(GridView)
1. the html markup <div> <asp:GridView ID=" OnPageIndexChanging="GridView1_PageIn ...
- Java学习之位运算和逻辑运算符
今天看了一下HashMap类的源码,在HashMap的源码中定义了初始空间的大小 static final int DEFAULT_INITIAL_CAPACITY = 1 << 4; 当 ...
- Error D8016 '/ZI' and '/Gy-' command-line options are incompatible
使用vs运行工程时出现错误: Severity Code Description Project File Line Suppression StateError D8016 '/ZI' and '/ ...
- PHP 时间和日期 总结
PHP 时间戳 UNIX 时间戳(timestamp)是 PHP 中关于时间日期一个很重要的概念,它表示从 1970年1月1日 00:00:00 到当前时间的秒数之和. 可以使用time()函数来获取 ...
- 第2章 Python基础语法 -- 数据类型
2.2数据类型 变量存储在内存中的值.这就意味着在创建变量时会在内存中开辟一个空间.基于变量的数据类型,解释器会分配指定内存,并决定什么数据可以被存储在内存中. 2.2.1 标准数据类型 在内存中存储 ...