| JQuery/js操作select下拉框 ：获取下拉框option的值，对下拉框的进行操作 | 您所在的位置：网站首页 › jq获取下拉框选中的值 › JQuery/js操作select下拉框 ：获取下拉框option的值，对下拉框的进行操作 |
JQuery/js操作select下拉框 ：获取下拉框option的值，对下拉框的进行操作
|
首先，我们先给出我们需要操作的下拉框的例子： 第一个OPTION 第二个OPTION 第三个OPTION 第四个OPTION 第五个OPTION 第六个OPTION 第七个OPTION 第八个OPTION 第九个OPTION 第十个OPTION方法一：原生js 我们都知道html页面是一个个Dom节点构建而成，所以我们在对页面进行js操作时，无非就是对于特定地Dom节点进行操作。 这时，我们可以使用 ***document.getElement******来获取我们需要操作的Dom节点。 document.getElementById("EEE");//定位select下拉框的Dom节点 //这时我们可以使用一个“盒子”对其进行接收 var Dom=document.getElementById("EEE"); //然后我们就可以使用 Dom 来对下拉框进行操作了。 Dom.length;//获取下拉框option的个数 10 Dom.value;//获取下拉框所选择的option中的value值 Dom[i];//获取下拉框 第i项 注意 i是从0开始的 Dom[i].value;//获取下拉框 第i项 的value值 注意 i是从0开始的 Dom.selectedIndex;//获取下拉框被选中的 index值 注意index也是从0开始的 Dom.selectedIndex='i';//选择第i项 注意 i是从0开始的 Dom.selectedOptions;//获取被选中的option 注意这是获取到的为一个数组因此我们需要用使用下面的方法进行获取 Dom.selectedOptions[0];//获取被选中的option 第一个OPTION Dom.selectedOptions[0].value;//获取被选中的option的value值 "1" Dom.selectedOptions[0].text;//获取被选中的option对应的中文 "第一个OPTION" Dom[0].text='123';//将第0项的文字改为 123
方法二：使用JQuery JQuery能方便我们对Dom节点进行操作，在使用前请确保你的html页面中使用JQuery。 与原生js一样，首先我们需要获取到我们需要操作的Dom节点 $("#EEE");//获取节点 $("#EEE").length;//获取下拉框option的个数 10 $("#EEE").value;//获取下拉框所选择的option中的value值 $("#EEE")[i];//获取下拉框 第i项 注意 i是从0开始的 $("#EEE")[i].value;//获取下拉框 第i项 的value值 注意 i是从0开始的 $("#EEE").selectedIndex;//获取下拉框被选中的 index值 注意index也是从0开始的 $("#EEE").selectedIndex='i';//选择第i项 注意 i是从0开始的 $("#EEE").selectedOptions;//获取被选中的option 注意这是获取到的为一个数组因此我们需要用使用下面的方法进行获取 $("#EEE").selectedOptions[0];//获取被选中的option 第一个OPTION $("#EEE").selectedOptions[0].value;//获取被选中的option的value值 "1" $("#EEE").selectedOptions[0].text;//获取被选中的option对应的中文 "第一个OPTION" //其实jquery和js方法几乎一样，都是先要获取到被操作的Dom节点 |
【本文地址】
公司简介
联系我们