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
因为是转载文章 在此标明出处,以前有文章是转的没标明的请谅解,因为有些已经无法找到出处,或者与其它原因. 如有冒犯请联系本人,或删除,或标明出处. 因为好的文章,以前只想收藏,但连接有时候会失效,所以 ...
随机推荐
- 网络爬虫返回json处理数据
JSON(JavaScript Object Notation) 是一种轻量级的数据交换格式.它基于JavaScript(Standard ECMA-262 3rd Edition - Decembe ...
- linux技术框架
编程语言 一般使用c或者c++ linux使用 鸟哥私房菜 工具使用 代码编辑source insight,代码编译gcc,代码调试gdb,代码编译组织makefile,命令执行shell,文本编辑n ...
- java 面试 复习 II
1 break 多重 循环跳出当前循环到上层循环再执行. 如若想跳出多重循环可以使用标号 2 byte,short,char都可以隐含转换为int.可以用在switch 表达式.long和str ...
- AndroidStudio项目移植到Eclipse
原文件结构: 在AndroidStudio中 main目录对应eclipse中的src目录 可以看看每个文件夹下的目录 没有src或者main这些文件夹的都可以删掉 我这里只有app下的东西是需要留着 ...
- 面试之get和post(转)
总结1 表单提交中get和post方式的区别归纳如下几点: GET是从服务器上获取数据,POST是向服务器传送数据,GET 请求一般不应产生副作用.就是说,它仅仅是获取资源信息,就像数据库查询一样,不 ...
- IE浏览器下<A>标签不能显示背景图片
修改前 background: url('./img/active/legendBg.png')no-repeat 修改后 background: url('./img/active/legendBg ...
- android studio使用的各种问题
1.添加权限,没有图形界面.添加权限的位置在<application>节点外,如果在节点内添加会报错的 2.查看logcat:要查看logcat的内容,要点一下设备 3.显示行号:在set ...
- 初学MVC
学习MVC基础:C#. ADO.NET .html.javascript.ASP.Net .WebFrom MVC模式两种理解:一种是表现模式,另一种是架构模式.它将应用程序分成三个主要的组件:视图( ...
- webviewactivity
WebView注意点,注释里有说明 package com.example.suneyaenews; import com.example.http.HttpThread; import androi ...
- ASP.NET 定时通知
ASP.NET 定时通知 using System; using System.Collections.Generic; using System.Linq; using System.Web; us ...