jQuery的Select操作集合

fmms 12年前
     <div class="BlogContent TextContent">     <span style="text-align:left;line-height:18px;font-family:verdana, 'ms song', 宋体, Arial, 微软雅黑, Helvetica, sans-serif;font-size:12px;">      <div class="div">       jQuery获取Select选择的Text和Value:       <br /> 语法解释:       <br /> 1. $("#select_id").change(function(){//code...});          <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//为Select添加事件,当选择其中一项时触发</span>       <br /> 2. var checkText=$("#select_id").find("option:selected").text();         <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//获取Select选择的Text</span>       <br /> 3. var checkValue=$("#select_id").val();         <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//获取Select选择的Value</span>       <br /> 4. var checkIndex=$("#select_id ").get(0).selectedIndex;         <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//获取Select选择的索引值</span>       <br />       <p>5. var maxIndex=$("#select_id option:last").attr("index");   <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//获取Select最大的索引值</span></p> jQuery设置Select选择的Text和Value:       <br /> 语法解释:       <br /> 1. $("#select_id ").get(0).selectedIndex=1;         <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//设置Select索引值为1的项选中</span>       <br /> 2. $("#select_id ").val(4);          <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//设置Select的Value值为4的项选中</span>       <br /> 3. $("#select_id option[text='jQuery']").attr("selected", true);          <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//设置Select的Text值为jQuery的项选中</span>       <br />       <br />      </div>      <div class="div">       jQuery添加/删除Select的Option项:       <br /> 语法解释:       <br /> 1. $("#select_id").append("<option value='Value'>Text</option>");         <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//为Select追加一个Option(下拉项)</span>       <br /> 2. $("#select_id").prepend("<option value='0'>请选择</option>");         <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//为Select插入一个Option(第一个位置)</span>       <br /> 3. $("#select_id option:last").remove();         <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//删除Select中索引值最大Option(最后一个)</span>       <br /> 4. $("#select_id option[index='0']").remove();         <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//删除Select中索引值为0的Option(第一个)</span>       <br /> 5. $("#select_id option[value='3']").remove();         <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//删除Select中Value='3'的Option</span>       <br /> 5. $("#select_id option[text='4']").remove();         <span style="padding-bottom:0px;line-height:1.5em;margin:0px;padding-left:0px;padding-right:0px;color:green;padding-top:0px;">//删除Select中Text='4'的Option</span>      </div> </span>    </div>