JQUERY對(duì)單選框(radio)操作的小例子

更新時(shí)間：2013年04月25日 11:16:30 作者：

在aspx文件中使用一個(gè)RadioButtonList控件顯示兩個(gè)radio標(biāo)簽。表示一對(duì)選中狀態(tài)：

<asp:RadioButtonList runat="server" ID="rblShow" class="show"

                 RepeatDirection="Horizontal">

                 <asp:ListItem Text="是" value="1" />

                 <asp:ListItem Text="否" value="0"/>

   </asp:RadioButtonList>

 <p class="isShow" style="width: 500px">
                測(cè)試文字
 </p>

然后在腳本js中添加Jquery引用后。

復(fù)制代碼代碼如下:

<script type="text/javascript">
         $(function () {
             $(":radio").click(function () {
                 if ($(this).val() == "1") {
                     $(".isShow").fadeIn();
                 } else {
                     $(".isShow").fadeOut();
                 }
             })
         })

$(":radio").click(function () 添加對(duì)radio的js事件，然后判斷value后，對(duì)后面的測(cè)試文字進(jìn)行淡入淡出操作。

OK,操作完成。如此便可以自由的操作頁(yè)面上的任何元素了。

您可能感興趣的文章:

相關(guān)文章

8款非常棒的響應(yīng)式j(luò)Query 幻燈片插件推薦
這篇文章收集了8款優(yōu)秀的響應(yīng)式 jQuery 幻燈片插件，它們能夠非常容易的集成到 Web 項(xiàng)目中。響應(yīng)式（Responsive）設(shè)計(jì)的目標(biāo)是要讓產(chǎn)品界面能夠響應(yīng)用戶(hù)的行為，根據(jù)不同終端設(shè)備自動(dòng)調(diào)整尺寸，帶給用戶(hù)良好的使用體驗(yàn)
2012-02-02
jQuery使用after()方法在元素后面添加多項(xiàng)內(nèi)容的方法
這篇文章主要介紹了jQuery使用after()方法在元素后面添加多項(xiàng)內(nèi)容的方法,實(shí)例分析了jQuery中after方法的功能及在元素后面添加內(nèi)容的技巧,非常具有實(shí)用價(jià)值,需要的朋友可以參考下
2015-03-03
jQuery+PHP實(shí)現(xiàn)動(dòng)態(tài)數(shù)字展示特效
我們?cè)谝恍?yīng)用中需要?jiǎng)討B(tài)展示數(shù)據(jù)，比如當(dāng)前在線人數(shù)，當(dāng)前交易總額，當(dāng)前匯率等等，前端頁(yè)面需要實(shí)時(shí)刷新獲取最新數(shù)據(jù)。本文將結(jié)合實(shí)例給大家介紹使用jQuery和PHP來(lái)實(shí)現(xiàn)動(dòng)態(tài)數(shù)字展示效果。
2015-03-03
原生javascript實(shí)現(xiàn)的分頁(yè)插件pagenav
這幾天要做一個(gè)前臺(tái)頁(yè)面,涉及到分頁(yè),不想自己去寫(xiě)所以在網(wǎng)上找jquery看有沒(méi)有好用一點(diǎn)的分頁(yè)組件,結(jié)果發(fā)現(xiàn)有很多,但是都很麻煩,看到了這個(gè)叫pagenav的發(fā)現(xiàn)相對(duì)來(lái)說(shuō)還是很容易上手的,于是就直接用了,在我看來(lái),能解決問(wèn)題的辦法就是好辦法.越簡(jiǎn)單越好.
2014-08-08
ExtJs動(dòng)態(tài)生成treepanel的Json格式
這篇文章主要介紹了ExtJs動(dòng)態(tài)生成treepanel的Json格式的相關(guān)資料,需要的朋友可以參考下
2015-07-07
jQuery+jsp下拉框聯(lián)動(dòng)獲取本地?cái)?shù)據(jù)的方法(附源碼)
這篇文章主要介紹了jQuery+jsp下拉框聯(lián)動(dòng)獲取本地?cái)?shù)據(jù)的方法,以實(shí)例形式較為詳細(xì)的分析了jQuery結(jié)合jsp實(shí)現(xiàn)下拉聯(lián)動(dòng)菜單讀取本地?cái)?shù)據(jù)的相關(guān)技巧,并附帶了完整源碼供讀者下載參考,需要的朋友可以參考下
2015-12-12
jQuery插件StickUp實(shí)現(xiàn)網(wǎng)頁(yè)導(dǎo)航置頂
本文給大家介紹的是一款jQuery插件--StickUp，他的主要用途是實(shí)現(xiàn)網(wǎng)頁(yè)元素固定，如導(dǎo)航固定讓其總是保持在視圖中可見(jiàn)，效果非常不錯(cuò)，這里推薦給小伙伴們。
2015-04-04
jquery和js實(shí)現(xiàn)對(duì)div的隱藏和顯示方法
jquery和js分別可以實(shí)現(xiàn)對(duì)div的隱藏和顯示，方法也不一樣，jquery的show、show;js的hidden、visible
2014-09-09
jquery validation插件表單驗(yàn)證的一個(gè)例子
jquery.validate.js validation表單的驗(yàn)證插件
2010-03-03
jquery插件tytabs.jquery.min.js實(shí)現(xiàn)漸變TAB選項(xiàng)卡效果
這篇文章主要介紹了jquery插件tytabs.jquery.min.js實(shí)現(xiàn)漸變TAB選項(xiàng)卡效果,實(shí)例分析了tytabs.jquery.min.js插件實(shí)現(xiàn)tab選項(xiàng)卡切換效果的使用技巧,具有一定參考借鑒價(jià)值,需要的朋友可以參考下
2015-08-08