关于jquery获取select,option所有的value和text实例讲解-js教程-PHP中文网

本文主要为大家带来一篇jquery获取select,option所有的value和text的实例。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧，希望能帮助到大家。

想想学习jQuery也有几天了，然后今天由于工作需要，我需要把select对应下的option所有的value和text获取出来，然后拼接，导入到xml文件中，结果搞了一下午，终于搞出来了。下面是对应的代码：

中的代码是从别人的网站上复制过来的，我现在需要获取它的value和text，然后拼接成

7朝阳>的形式

html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


<meta>
 <script></script>
 <script> 
 $(document).ready(function(){ //等待所有dom绘制完成后就执行
  
     var arr = new Array(); //数组定义标准形式，不要写成Array arr = new Array();
     var all = ""; //定义变量全部保存
     $("#UserBorough option").each(function () {
       var txt = $(this).text(); //获取单个text
       var val = $(this).val(); //获取单个value
       var node = "<" + txt + ">" + val + "</" + txt + ">";
       arr.push(node);
       all += node;
     });
     alert(all);
     alert(arr);

  
 }); //$(document)
 </script>

 <select>
            <option>朝阳</option>
<option>海淀</option>
<option>昌平</option>
<option>丰台</option>
<option>大兴</option>
<option>东城</option>
<option>西城</option>
<option>崇文</option>
<option>宣武</option>
<option>通州</option>
<option>顺义</option>
<option>房山</option>
<option>石景山</option>
<option>门头沟</option>
<option>怀柔</option>
<option>密云</option>
<option>延庆</option>
<option>平谷</option>
<option>周边</option></select>

总结：结合工具能省很大的事，你可以在VS2010中新建一个html文件敲代码，然后把代码复制到

Dreamweaver中运行，这样会很节省时间。

通过这个例子，我认识到，仅仅把书上的那些代码看懂，照着敲下来，你不一定能写出东西，还是要多动手

jQuery 1.12.4

jQuery 1.12.4是jQuery 1.x系列的最后一个正式稳定版本，由jQuery团队于2016年发布。该版本主要面向需要兼容旧版浏览器环境的网站和Web应用，尤其适用于仍需支持Internet Explorer 6、Internet Explorer 7、Internet Explorer 8等老旧浏览器的项目。

下载

自己写。