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:

  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:

  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项:

    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

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

  1. JS & JQuery 动态添加 select option

    因为是转载文章 在此标明出处,以前有文章是转的没标明的请谅解,因为有些已经无法找到出处,或者与其它原因. 如有冒犯请联系本人,或删除,或标明出处. 因为好的文章,以前只想收藏,但连接有时候会失效,所以 ...

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

    //添加下拉框 function append_add(data) { $('#add').append( '<div class="form-group" id='+for ...

  3. Js Select动态添加Option

    var now = new Date(); function setDate(type, id, from, to) { var str = ""; for (var i = fr ...

  4. js jquery 动态添加表格

    for循环将你要添加的标签写上,然后直接var talbeAdd=""for(){ tableAdd+="<tr><td>这儿写你要添加的内容&l ...

  5. jQuery动态添加删除select项

    // 添加 function col_add() { var selObj = $("#mySelect"); var value="value"; var t ...

  6. JS对select动态添加option操作 (三级联动) (搜索拼接)

    以下纯属自我理解之下再东搜西查的内容~ JS对select动态添加option操作有个高大上的艺名叫多级联动:第一级改变时,第二级跟着变,第二级改变时,第三级跟着变... 本菜鸟是在工作中遇到做收货地 ...

  7. JS & JQuery 动态处理select option

    原文 出处http://www.51xuediannao.com/html+css/htmlcssjq/cssbuhuanhang.html 今天你问了我一个关于在<select>里动态添 ...

  8. <select>里动态添加option

    因为是转载文章 在此标明出处,以前有文章是转的没标明的请谅解,因为有些已经无法找到出处,或者与其它原因. 如有冒犯请联系本人,或删除,或标明出处. 因为好的文章,以前只想收藏,但连接有时候会失效,所以 ...

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

    给Jquery动态添加的元素添加事件 来源:[http://wangqixia.diandian.com/post/2011-05-10/6597866] 我想很多人都会向我一样曾经 被新元素的事件绑 ...

随机推荐

  1. Linux之sed,awk(流编辑器)

    sed:  s----substitute(替换) 1. 文本替换(使用-i选项,可以将结果应用于原文件) many people在进行替换之后,借助重定向来保存文件(未使用-i选项): $ sed  ...

  2. HTTP(一) 连接管理

    ・HTTP是如何使用TCP连接的 HTTP传送一条报文时,以流的形式将报文数据内容通过一条打开的TCP连接按序传输. TCP收到数据流之后,由TCP/IP软件将数据流砍成被称作段的小数据块,并将段封装 ...

  3. 69道java Spring面试题和答案

    http://www.jfox.info/69-dao-java-spring-mian-shi-ti-he-da-an 目录 Spring 概述 依赖注入 Spring beans Spring注解 ...

  4. Javascript(JS)对Cookie的读取、删除、写入操作帮助方法

    var CookieUtils = { get: function (name) { var cookieName = encodeURIComponent(name) + '=', cookieSt ...

  5. cocos2dx shader实现灰度图android后台切换回来导致图像偏移的问题

    转自:http://www.tuicool.com/articles/U3URRrI 项目中经常会遇到将一张图像处理成灰色的需求,为了节省资源,一般不会让美术再做一套同样的灰度图,通常会通过代码处理让 ...

  6. android 根据SD卡中图片路径读取并显示SD中的图片——源代码

    package com.guo; import java.io.File; import android.app.Activity; import android.graphics.Bitmap; i ...

  7. jquery,extjs中的extend用法小结

    在jquery中,extend其实在做插件时还是用的比较多的,今天同时小结jquery和ext js中 的extend用法,先来看jquery中的. 1)  extend(dest,src1,src2 ...

  8. BZOJ 1014: [JSOI2008]火星人prefix Splay+二分

    1014: [JSOI2008]火星人prefix 题目连接: http://www.lydsy.com/JudgeOnline/problem.php?id=1014 Description 火星人 ...

  9. Codeforces Gym 100015C City Driving 离线LCA

    City Driving 题目连接: http://codeforces.com/gym/100015/attachments Description You recently started fre ...

  10. hdu 5594 ZYB's Prime 最大流

    ZYB's Prime Time Limit: 20 Sec Memory Limit: 256 MB 题目连接 http://acm.hdu.edu.cn/showproblem.php?pid=5 ...