js、jquery、动态添加option项

  1. var selid = document.getElementById("sltid");
  2. for(var i=0; i<10;i++){     //循环添加多个值
  3. sid.option[i] = new Option(i,i);
  4. }
  5. sid.options[sid.options.length]=new Option("1","2");   // 在最后一个值后面添加多一个

JQuery:

[html] view plaincopy

  1. <select id="aa"></select>
  2. 1.jQuery("<option value=‘1‘>abc</option>").appendTo("#aa");
  3. 2.jQuery("<option></option>").attr({val:"1",text:"abc"}).appendTo("#aa");
  4. 3.jQuery("<option></option>").val("1").text("abc").appendTo("#aa");
  5. 4.$("#selectId").append("<option value=‘"+value+"‘>"+text+"</option>");

当然除了这几句,还有设置默认选择值、第一个的值、最后一个的值、第N个的值等等的,所以在网上搜了一上:

jQuery获取Select选择的Text和Value:

[html] view plaincopy

  1. $("#select_id").change(function(){//code...});   //为Select添加事件,当选择其中一项时触发
  2. var checkText=$("#select_id").find("option:selected").text();  //获取Select选择的Text
  3. var checkValue=$("#select_id").val();  //获取Select选择的Value
  4. var checkIndex=$("#select_id ").get(0).selectedIndex;  //获取Select选择的索引值
  5. var maxIndex=$("#select_id option:last").attr("index");  //获取Select最大的索引值

jQuery添加/删除Select的Option项:

[html] view plaincopy

    1. 1. $("#select_id").append("<option value=‘Value‘>Text</option>");  //为Select追加一个Option(下拉项)
    2. 2. $("#select_id").prepend("<option value=‘0‘>请选择</option>");  //为Select插入一个Option(第一个位置)
    3. 3. $("#select_id option:last").remove();  //删除Select中索引值最大Option(最后一个)
    4. 4. $("#select_id option[index=‘0‘]").remove();  //删除Select中索引值为0的Option(第一个)
    5. 5. $("#select_id option[value=‘3‘]").remove();  //删除Select中Value=‘3‘的Option
    6. 5. $("#select_id option[text=‘4‘]").remove();  //删除Select中Text=‘4‘的Option
时间: 2024-10-07 03:34:28

js、jquery、动态添加option项的相关文章

Jquery 动态添加option 并给option添加数据,并帮定事件

//添加下拉框 function append_add(data) { $('#add').append( '<div class="form-group" id='+form_group_id+'>' + '<label for="shebeis">起始设备</label>' + '<select id=' + select_id + ' name="shebeis">' + '<optio

js jquery 动态添加表格

for循环将你要添加的标签写上,然后直接var talbeAdd=""for(){ tableAdd+="<tr><td>这儿写你要添加的内容</td></tr>"; }$("table").append("这个写你要添加的标签");你想通过什么事件添加自己写

Js Select动态添加Option

var now = new Date(); function setDate(type, id, from, to) { var str = ""; for (var i = from; i < to + 1; i++) { if ((type == "y" && i == now.getFullYear()) || (type == "m" && i == now.getMonth() + 1) || (t

Jquery 动态添加删除元素 用js添加的元素无法删除问题

用jquery方法的绑定侦听和销毁来解决动态div的增加删除: 正确代码: <script type="text/javascript" > $(document).ready(function(){  bindListener(); }) function addimg(){  $("#mdiv").append('<div ><input type="file" name="img[]" /&

jquey学习2之jquery动态添加页面片段

第一个方法:append()方法 [1]$(selector).append(content)//向匹配的所有标签中的内容末尾处添加Html代码,会编译成页面显示. 1 <html> 2 <head> 3 <script type="text/javascript" src="/jquery/jquery.js"></script> 4 <script type="text/javascript&quo

jquery动态添加删除一行数据

<html> <head> <title>添加.删除一行</title> <meta http-equiv="content-type" content="text/html; charset=UTF-8"> <script type="text/javascript" src="../js/jquery-1.9.1.js"></script>

js+jquery动态设置/增加/删除/获取元素属性的两种方法集锦对比(动态onclick属性设置+动态title设置)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0//EN" "http://www.w3.org/TR/REC-html140/strict.dtd"> <html> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8"/> <title>

jquery动态添加节点

<1> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title&

给Jquery动态添加的元素添加事件

给Jquery动态添加的元素添加事件 我想很多人都会向我一样曾经 被新元素的事件绑定困惑很久也就是在页面加载完成后给元素绑定了事件,但又新增加的元素上却没有绑定任何事件. js的事件监听跟css不一样,css只要设定好了样式,不论是原来就有的还是新添加的,都有一样的表现.而事件监听不是,你必须给每一个元素单独绑定事件. 常见的例子是处理表格的时候.每行行末有个删除按钮,点了这个能够删除这一行. <table>    <tbody>        <tr>