jquery的checkbox,radio,select等方法總結

jquery的checkbox,radio,select等方法總結,該文章爲我的新博客文章,以後此博客更新頻率會降低,想查看我的最新博客文章請看 http://www.haorooms.com/

jquery的checkbox,radio,和select是jquery操作的一個難點和重點,很多前端新手對其瞭解不是很透徹。時間久了不用,我在寫的時候有時也難免對某些操作支支吾吾,記不清楚,現在,對其做一些簡單的總結!

1、checkbox日常jquery操作。 現在我們以下面的html爲例進行checkbox的操作。

<code style="margin: 0px; padding: 0px; font-family: Menlo, Monaco, Consolas, 'Lucida Console', 'Courier New', 'Microsoft Yahei', monospace; background-color: transparent;"><span class="tag" style="color: rgb(0, 0, 136);"><input</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">id</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"checkAll"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">type</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"checkbox"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="tag" style="color: rgb(0, 0, 136);">/></span><span class="pln" style="color: rgb(0, 0, 0);">全選
        </span><span class="tag" style="color: rgb(0, 0, 136);"><input</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">name</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"subBox"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">type</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"checkbox"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="tag" style="color: rgb(0, 0, 136);">/></span><span class="pln" style="color: rgb(0, 0, 0);">項1
        </span><span class="tag" style="color: rgb(0, 0, 136);"><input</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">name</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"subBox"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">type</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"checkbox"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="tag" style="color: rgb(0, 0, 136);">/></span><span class="pln" style="color: rgb(0, 0, 0);">項2
        </span><span class="tag" style="color: rgb(0, 0, 136);"><input</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">name</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"subBox"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">type</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"checkbox"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="tag" style="color: rgb(0, 0, 136);">/></span><span class="pln" style="color: rgb(0, 0, 0);">項3
        </span><span class="tag" style="color: rgb(0, 0, 136);"><input</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">name</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"subBox"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">type</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"checkbox"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="tag" style="color: rgb(0, 0, 136);">/></span><span class="pln" style="color: rgb(0, 0, 0);">項4</span></code>

全選和全部選代碼:

<code style="margin: 0px; padding: 0px; font-family: Menlo, Monaco, Consolas, 'Lucida Console', 'Courier New', 'Microsoft Yahei', monospace; background-color: transparent;"><span class="tag" style="color: rgb(0, 0, 136);"><script</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">type</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"text/javascript"</span><span class="tag" style="color: rgb(0, 0, 136);">></span><span class="pln" style="color: rgb(0, 0, 0);">
        $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="kwd" style="color: rgb(0, 0, 136);">function</span><span class="pun" style="color: rgb(102, 102, 0);">()</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">{</span><span class="pln" style="color: rgb(0, 0, 0);">
           $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#checkAll"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">click</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="kwd" style="color: rgb(0, 0, 136);">function</span><span class="pun" style="color: rgb(102, 102, 0);">()</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">{</span><span class="pln" style="color: rgb(0, 0, 0);">
                $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">'input[name="subBox"]'</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="kwd" style="color: rgb(0, 0, 136);">this</span><span class="pun" style="color: rgb(102, 102, 0);">.</span><span class="pln" style="color: rgb(0, 0, 0);">checked</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);"> 
            </span><span class="pun" style="color: rgb(102, 102, 0);">});</span><span class="pln" style="color: rgb(0, 0, 0);">
            </span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> $subBox </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[name='subBox']"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);">
            $subBox</span><span class="pun" style="color: rgb(102, 102, 0);">.</span><span class="pln" style="color: rgb(0, 0, 0);">click</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="kwd" style="color: rgb(0, 0, 136);">function</span><span class="pun" style="color: rgb(102, 102, 0);">(){</span><span class="pln" style="color: rgb(0, 0, 0);">
                $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#checkAll"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="pln" style="color: rgb(0, 0, 0);">$subBox</span><span class="pun" style="color: rgb(102, 102, 0);">.</span><span class="pln" style="color: rgb(0, 0, 0);">length </span><span class="pun" style="color: rgb(102, 102, 0);">==</span><span class="pln" style="color: rgb(0, 0, 0);"> $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[name='subBox']:checked"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">length </span><span class="pun" style="color: rgb(102, 102, 0);">?</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="kwd" style="color: rgb(0, 0, 136);">true</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">:</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="kwd" style="color: rgb(0, 0, 136);">false</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);">
            </span><span class="pun" style="color: rgb(102, 102, 0);">});</span><span class="pln" style="color: rgb(0, 0, 0);">
        </span><span class="pun" style="color: rgb(102, 102, 0);">});</span><span class="pln" style="color: rgb(0, 0, 0);">
    </span><span class="tag" style="color: rgb(0, 0, 136);"></script></span></code>

checkbox屬性:

<code style="margin: 0px; padding: 0px; font-family: Menlo, Monaco, Consolas, 'Lucida Console', 'Courier New', 'Microsoft Yahei', monospace; background-color: transparent;"><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> val </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#checkAll"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">val</span><span class="pun" style="color: rgb(102, 102, 0);">();</span><span class="com" style="color: rgb(136, 0, 0);">// 獲取指定id的複選框的值  </span><span class="pln" style="color: rgb(0, 0, 0);">
</span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> isSelected </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#checkAll"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="com" style="color: rgb(136, 0, 0);">// 判斷id=checkAll的那個複選框是否處於選中狀態,選中則isSelected=true;否則isSelected=false;  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#checkAll"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="kwd" style="color: rgb(0, 0, 136);">true</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="com" style="color: rgb(136, 0, 0);">// or  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#checkAll"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="str" style="color: rgb(0, 136, 0);">'checked'</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="com" style="color: rgb(136, 0, 0);">// 將id=checkbox_id3的那個複選框選中,即打勾  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#checkAll"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="kwd" style="color: rgb(0, 0, 136);">false</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="com" style="color: rgb(136, 0, 0);">// or  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#checkAll"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="str" style="color: rgb(0, 136, 0);">''</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="com" style="color: rgb(136, 0, 0);">// 將id=checkbox_id3的那個複選框不選中,即不打勾  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[name=subBox][value=3]"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="str" style="color: rgb(0, 136, 0);">'checked'</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="com" style="color: rgb(136, 0, 0);">// 將name=subBox, value=3 的那個複選框選中,即打勾  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[name=subBox][value=3]"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="str" style="color: rgb(0, 136, 0);">''</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="com" style="color: rgb(136, 0, 0);">// 將name=subBox, value=3 的那個複選框不選中,即不打勾  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[type=checkbox][name=subBox]"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">get</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">2</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">checked</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="kwd" style="color: rgb(0, 0, 136);">true</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="com" style="color: rgb(136, 0, 0);">// 設置index = 2,即第三項爲選中狀態  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[type=checkbox]:checked"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">each</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="kwd" style="color: rgb(0, 0, 136);">function</span><span class="pun" style="color: rgb(102, 102, 0);">(){</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="com" style="color: rgb(136, 0, 0);">//由於複選框一般選中的是多個,所以可以循環輸出選中的值  </span><span class="pln" style="color: rgb(0, 0, 0);">
    alert</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="pln" style="color: rgb(0, 0, 0);">$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="kwd" style="color: rgb(0, 0, 136);">this</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">val</span><span class="pun" style="color: rgb(102, 102, 0);">());</span><span class="pln" style="color: rgb(0, 0, 0);">  
</span><span class="pun" style="color: rgb(102, 102, 0);">});</span><span class="pln" style="color: rgb(0, 0, 0);"> </span></code>

2、radio的jquery日常操作及屬性 我們仍然以下面的html爲例:

<code style="margin: 0px; padding: 0px; font-family: Menlo, Monaco, Consolas, 'Lucida Console', 'Courier New', 'Microsoft Yahei', monospace; background-color: transparent;"><span class="tag" style="color: rgb(0, 0, 136);"><input</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">type</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">name</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">id</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio1"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">value</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"1"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="tag" style="color: rgb(0, 0, 136);">/></span><span class="pln" style="color: rgb(0, 0, 0);">1  
</span><span class="tag" style="color: rgb(0, 0, 136);"><input</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">type</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">name</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">id</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio2"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">value</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"2"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="tag" style="color: rgb(0, 0, 136);">/></span><span class="pln" style="color: rgb(0, 0, 0);">2  
</span><span class="tag" style="color: rgb(0, 0, 136);"><input</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">type</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">name</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">id</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio3"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">value</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"3"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="tag" style="color: rgb(0, 0, 136);">/></span><span class="pln" style="color: rgb(0, 0, 0);">3  
</span><span class="tag" style="color: rgb(0, 0, 136);"><input</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">type</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">name</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">id</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"radio4"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">value</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"4"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="tag" style="color: rgb(0, 0, 136);">/></span><span class="pln" style="color: rgb(0, 0, 0);">4 </span></code>

radio操作如下:

<code style="margin: 0px; padding: 0px; font-family: Menlo, Monaco, Consolas, 'Lucida Console', 'Courier New', 'Microsoft Yahei', monospace; background-color: transparent;"><span class="pln" style="color: rgb(0, 0, 0);">$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[name=radio]:eq(0)"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="str" style="color: rgb(0, 136, 0);">'checked'</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="com" style="color: rgb(136, 0, 0);">//這樣就是第一個選中咯。</span><span class="pln" style="color: rgb(0, 0, 0);">
  </span><span class="com" style="color: rgb(136, 0, 0);">//jquery中,radio的選中與否和checkbox是一樣的。</span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#radio1"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#radio1"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">removeAttr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[type='radio'][name='radio']:checked"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">length </span><span class="pun" style="color: rgb(102, 102, 0);">==</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="lit" style="color: rgb(0, 102, 102);">0</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">?</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="str" style="color: rgb(0, 136, 0);">"沒有任何單選框被選中"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">:</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="str" style="color: rgb(0, 136, 0);">"已經有選中"</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="pln" style="color: rgb(0, 0, 0);">  
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">'input[type="radio"][name="radio"]:checked'</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">val</span><span class="pun" style="color: rgb(102, 102, 0);">();</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="com" style="color: rgb(136, 0, 0);">// 獲取一組radio被選中項的值  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[type='radio'][name='radio'][value='2']"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="com" style="color: rgb(136, 0, 0);">// 設置value = 2的一項爲選中  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#radio2"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="com" style="color: rgb(136, 0, 0);">// 設置id=radio2的一項爲選中  </span><span class="pln" style="color: rgb(0, 0, 0);">
$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[type='radio'][name='radio']"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">get</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">1</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">checked</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="kwd" style="color: rgb(0, 0, 136);">true</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="com" style="color: rgb(136, 0, 0);">// 設置index = 1,即第二項爲當前選中  </span><span class="pln" style="color: rgb(0, 0, 0);">
</span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> isChecked </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#radio2"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="com" style="color: rgb(136, 0, 0);">// id=radio2的一項處於選中狀態則isChecked = true, 否則isChecked = false;  </span><span class="pln" style="color: rgb(0, 0, 0);">
</span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> isChecked </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"input[type='radio'][name='radio'][value='2']"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"checked"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="com" style="color: rgb(136, 0, 0);">// value=2的一項處於選中狀態則isChecked = true, 否則isChecked = false;  </span></code>

3、select下拉框的日常jquery操作 select操作相比checkbox和radio要相對麻煩一些,我們仍然以下面的html爲例來說明:

<code style="margin: 0px; padding: 0px; font-family: Menlo, Monaco, Consolas, 'Lucida Console', 'Courier New', 'Microsoft Yahei', monospace; background-color: transparent;"><span class="tag" style="color: rgb(0, 0, 136);"><select</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">name</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"select"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">id</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"select_id"</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">style</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"</span><span class="pln" style="color: rgb(0, 0, 0);">width</span><span class="pun" style="color: rgb(102, 102, 0);">:</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="lit" style="color: rgb(0, 102, 102);">100px</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="atv" style="color: rgb(0, 136, 0);">"</span><span class="tag" style="color: rgb(0, 0, 136);">></span><span class="pln" style="color: rgb(0, 0, 0);">  
    </span><span class="tag" style="color: rgb(0, 0, 136);"><option</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">value</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"1"</span><span class="tag" style="color: rgb(0, 0, 136);">></span><span class="pln" style="color: rgb(0, 0, 0);">11</span><span class="tag" style="color: rgb(0, 0, 136);"></option></span><span class="pln" style="color: rgb(0, 0, 0);">  
    </span><span class="tag" style="color: rgb(0, 0, 136);"><option</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">value</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"2"</span><span class="tag" style="color: rgb(0, 0, 136);">></span><span class="pln" style="color: rgb(0, 0, 0);">22</span><span class="tag" style="color: rgb(0, 0, 136);"></option></span><span class="pln" style="color: rgb(0, 0, 0);">  
    </span><span class="tag" style="color: rgb(0, 0, 136);"><option</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">value</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"3"</span><span class="tag" style="color: rgb(0, 0, 136);">></span><span class="pln" style="color: rgb(0, 0, 0);">33</span><span class="tag" style="color: rgb(0, 0, 136);"></option></span><span class="pln" style="color: rgb(0, 0, 0);">  
    </span><span class="tag" style="color: rgb(0, 0, 136);"><option</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">value</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"4"</span><span class="tag" style="color: rgb(0, 0, 136);">></span><span class="pln" style="color: rgb(0, 0, 0);">44</span><span class="tag" style="color: rgb(0, 0, 136);"></option></span><span class="pln" style="color: rgb(0, 0, 0);">  
    </span><span class="tag" style="color: rgb(0, 0, 136);"><option</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">value</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"5"</span><span class="tag" style="color: rgb(0, 0, 136);">></span><span class="pln" style="color: rgb(0, 0, 0);">55</span><span class="tag" style="color: rgb(0, 0, 136);"></option></span><span class="pln" style="color: rgb(0, 0, 0);">  
    </span><span class="tag" style="color: rgb(0, 0, 136);"><option</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="atn" style="color: rgb(102, 0, 102);">value</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="atv" style="color: rgb(0, 136, 0);">"6"</span><span class="tag" style="color: rgb(0, 0, 136);">></span><span class="pln" style="color: rgb(0, 0, 0);">66</span><span class="tag" style="color: rgb(0, 0, 136);"></option></span><span class="pln" style="color: rgb(0, 0, 0);">  
</span><span class="tag" style="color: rgb(0, 0, 136);"></select></span><span class="pln" style="color: rgb(0, 0, 0);"> </span></code>

看select的如下屬性:

<code style="margin: 0px; padding: 0px; font-family: Menlo, Monaco, Consolas, 'Lucida Console', 'Courier New', 'Microsoft Yahei', monospace; background-color: transparent;"><span class="pln" style="color: rgb(0, 0, 0);">    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">change</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="kwd" style="color: rgb(0, 0, 136);">function</span><span class="pun" style="color: rgb(102, 102, 0);">(){</span><span class="pln" style="color: rgb(0, 0, 0);">                         </span><span class="com" style="color: rgb(136, 0, 0);">// 1.爲Select添加事件,當選擇其中一項時觸發   </span><span class="pln" style="color: rgb(0, 0, 0);">
        </span><span class="com" style="color: rgb(136, 0, 0);">//code...  </span><span class="pln" style="color: rgb(0, 0, 0);">
    </span><span class="pun" style="color: rgb(102, 102, 0);">});</span><span class="pln" style="color: rgb(0, 0, 0);">  
    </span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> checkValue </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">val</span><span class="pun" style="color: rgb(102, 102, 0);">();</span><span class="pln" style="color: rgb(0, 0, 0);">                    </span><span class="com" style="color: rgb(136, 0, 0);">// 2.獲取Select選中項的Value  </span><span class="pln" style="color: rgb(0, 0, 0);">
    </span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> checkText </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id :selected"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">text</span><span class="pun" style="color: rgb(102, 102, 0);">();</span><span class="pln" style="color: rgb(0, 0, 0);">          </span><span class="com" style="color: rgb(136, 0, 0);">// 3.獲取Select選中項的Text   </span><span class="pln" style="color: rgb(0, 0, 0);">
    </span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> checkIndex </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"selectedIndex"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);">    </span><span class="com" style="color: rgb(136, 0, 0);">// 4.獲取Select選中項的索引值,或者:$("#select_id").get(0).selectedIndex;  </span><span class="pln" style="color: rgb(0, 0, 0);">
    </span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> maxIndex </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id :last"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"index"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);">        </span><span class="com" style="color: rgb(136, 0, 0);">// 5.獲取Select最大的索引值,或者:$("#select_id :last").get(0).index;  </span><span class="pln" style="color: rgb(0, 0, 0);">
    </span><span class="com" style="color: rgb(136, 0, 0);">/** 
     * jQuery設置Select的選中項 
     */</span><span class="pln" style="color: rgb(0, 0, 0);">  
    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">get</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">0</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">selectedIndex </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="lit" style="color: rgb(0, 102, 102);">1</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="pln" style="color: rgb(0, 0, 0);">                  </span><span class="com" style="color: rgb(136, 0, 0);">// 1.設置Select索引值爲1的項選中  </span><span class="pln" style="color: rgb(0, 0, 0);">
    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">val</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">4</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);">                                    </span><span class="com" style="color: rgb(136, 0, 0);">// 2.設置Select的Value值爲4的項選中  </span><span class="pln" style="color: rgb(0, 0, 0);">
    </span><span class="com" style="color: rgb(136, 0, 0);">/** 
     * jQuery添加/刪除Select的Option項 
     */</span><span class="pln" style="color: rgb(0, 0, 0);">  
    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">append</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"<option value='新增'>新增option</option>"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);">    </span><span class="com" style="color: rgb(136, 0, 0);">// 1.爲Select追加一個Option(下拉項)   </span><span class="pln" style="color: rgb(0, 0, 0);">
    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">prepend</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"<option value='請選擇'>請選擇</option>"</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);">   </span><span class="com" style="color: rgb(136, 0, 0);">// 2.爲Select插入一個Option(第一個位置)  </span><span class="pln" style="color: rgb(0, 0, 0);">
    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">get</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">0</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">remove</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">1</span><span class="pun" style="color: rgb(102, 102, 0);">);</span><span class="pln" style="color: rgb(0, 0, 0);">                                      </span><span class="com" style="color: rgb(136, 0, 0);">// 3.刪除Select中索引值爲1的Option(第二個)  </span><span class="pln" style="color: rgb(0, 0, 0);">
    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id :last"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">remove</span><span class="pun" style="color: rgb(102, 102, 0);">();</span><span class="pln" style="color: rgb(0, 0, 0);">                                        </span><span class="com" style="color: rgb(136, 0, 0);">// 4.刪除Select中索引值最大Option(最後一個)   </span><span class="pln" style="color: rgb(0, 0, 0);">
    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id [value='3']"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">remove</span><span class="pun" style="color: rgb(102, 102, 0);">();</span><span class="pln" style="color: rgb(0, 0, 0);">                                  </span><span class="com" style="color: rgb(136, 0, 0);">// 5.刪除Select中Value='3'的Option   </span><span class="pln" style="color: rgb(0, 0, 0);">
    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">empty</span><span class="pun" style="color: rgb(102, 102, 0);">();</span><span class="pln" style="color: rgb(0, 0, 0);">             

   $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">find</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"option:selected"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">text</span><span class="pun" style="color: rgb(102, 102, 0);">();</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="com" style="color: rgb(136, 0, 0);">// 獲取select 選中的 text :</span><span class="pln" style="color: rgb(0, 0, 0);">

   $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">val</span><span class="pun" style="color: rgb(102, 102, 0);">();</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="com" style="color: rgb(136, 0, 0);">// 獲取select選中的 value:</span><span class="pln" style="color: rgb(0, 0, 0);">

     $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">get</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">0</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">selectedIndex</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="com" style="color: rgb(136, 0, 0);">// 獲取select選中的索引:</span><span class="pln" style="color: rgb(0, 0, 0);">

     $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">get</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">0</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">selectedIndex</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);">index</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="com" style="color: rgb(136, 0, 0);">//index爲索引值</span><span class="pln" style="color: rgb(0, 0, 0);">

 </span><span class="com" style="color: rgb(136, 0, 0);">//設置select 選中的value:</span><span class="pln" style="color: rgb(0, 0, 0);">
    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">attr</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"value"</span><span class="pun" style="color: rgb(102, 102, 0);">,</span><span class="str" style="color: rgb(0, 136, 0);">"Normal“);
    $("</span><span class="com" style="color: rgb(136, 0, 0);">#select_id").val("Normal");</span><span class="pln" style="color: rgb(0, 0, 0);">
    $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">get</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">0</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">value </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> value</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="pln" style="color: rgb(0, 0, 0);">

 </span><span class="com" style="color: rgb(136, 0, 0);">//設置select 選中的text,通常可以在select回填中使用</span><span class="pln" style="color: rgb(0, 0, 0);">
</span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> numId</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="lit" style="color: rgb(0, 102, 102);">33</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="com" style="color: rgb(136, 0, 0);">//設置text==33的選中!</span><span class="pln" style="color: rgb(0, 0, 0);">
</span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> count</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);">$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id  option"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">length</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="pln" style="color: rgb(0, 0, 0);">
  </span><span class="kwd" style="color: rgb(0, 0, 136);">for</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="kwd" style="color: rgb(0, 0, 136);">var</span><span class="pln" style="color: rgb(0, 0, 0);"> i</span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="lit" style="color: rgb(0, 102, 102);">0</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="pln" style="color: rgb(0, 0, 0);">i</span><span class="pun" style="color: rgb(102, 102, 0);"><</span><span class="pln" style="color: rgb(0, 0, 0);">count</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="pln" style="color: rgb(0, 0, 0);">i</span><span class="pun" style="color: rgb(102, 102, 0);">++)</span><span class="pln" style="color: rgb(0, 0, 0);">  
     </span><span class="pun" style="color: rgb(102, 102, 0);">{</span><span class="pln" style="color: rgb(0, 0, 0);">           </span><span class="kwd" style="color: rgb(0, 0, 136);">if</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="pln" style="color: rgb(0, 0, 0);">$</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">get</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">0</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">options</span><span class="pun" style="color: rgb(102, 102, 0);">[</span><span class="pln" style="color: rgb(0, 0, 0);">i</span><span class="pun" style="color: rgb(102, 102, 0);">].</span><span class="pln" style="color: rgb(0, 0, 0);">text </span><span class="pun" style="color: rgb(102, 102, 0);">==</span><span class="pln" style="color: rgb(0, 0, 0);"> numId</span><span class="pun" style="color: rgb(102, 102, 0);">)</span><span class="pln" style="color: rgb(0, 0, 0);">  
        </span><span class="pun" style="color: rgb(102, 102, 0);">{</span><span class="pln" style="color: rgb(0, 0, 0);">  
            $</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="str" style="color: rgb(0, 136, 0);">"#select_id"</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="kwd" style="color: rgb(0, 0, 136);">get</span><span class="pun" style="color: rgb(102, 102, 0);">(</span><span class="lit" style="color: rgb(0, 102, 102);">0</span><span class="pun" style="color: rgb(102, 102, 0);">).</span><span class="pln" style="color: rgb(0, 0, 0);">options</span><span class="pun" style="color: rgb(102, 102, 0);">[</span><span class="pln" style="color: rgb(0, 0, 0);">i</span><span class="pun" style="color: rgb(102, 102, 0);">].</span><span class="pln" style="color: rgb(0, 0, 0);">selected </span><span class="pun" style="color: rgb(102, 102, 0);">=</span><span class="pln" style="color: rgb(0, 0, 0);"> </span><span class="kwd" style="color: rgb(0, 0, 136);">true</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="pln" style="color: rgb(0, 0, 0);">  
            </span><span class="kwd" style="color: rgb(0, 0, 136);">break</span><span class="pun" style="color: rgb(102, 102, 0);">;</span><span class="pln" style="color: rgb(0, 0, 0);">  
        </span><span class="pun" style="color: rgb(102, 102, 0);">}</span><span class="pln" style="color: rgb(0, 0, 0);">  
    </span><span class="pun" style="color: rgb(102, 102, 0);">}</span></code>
發佈了52 篇原創文章 · 獲贊 2 · 訪問量 3萬+
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章