快捷導航

淺談監(jiān)聽單選框radio改變事件(和layui中單選按鈕改變事件)

更新時間：2019年09月10日 15:37:07 作者：林建龍

今天小編就為大家分享一篇淺談監(jiān)聽單選框radio改變事件(和layui中單選按鈕改變事件)，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

若是只引用jquery的話，監(jiān)聽單選按鈕改變事件如下：

<input type="radio" name="sex" checked="checked" value="1">男
<input type="radio" name="sex" value="2">女

$(document).ready(function() { 
 $('input[type=radio][name=sex]').change(function() {
  if (this.value == '1') { 
   alert("這是個男孩"); 
  } else if (this.value == '2') { 
   alert("這是個女孩"); 
  } 
 }); 
});

注意：如果是引用了layui的樣式和方法，則上面的監(jiān)聽事件失效，被layui接管了，所以應(yīng)該如下寫法：

layui.use(['form', 'element', 'laydate'], function(){
 var jQuery = layui.jquery
 ,layer = layui.layer
 ,form = layui.form()
 ,element = layui.element();

 form.on("radio(sex)", function (data) {
  var sex = data.value;
  if (this.value == '1') { 
   alert("這是個男孩"); 
  } else if (this.value == '2') { 
   alert("這是個女孩"); 
  } 
 });
});

以上這篇淺談監(jiān)聽單選框radio改變事件(和layui中單選按鈕改變事件)就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

加速IE的Javascript document輸出的方法
加入這樣的一行代碼IE的document的訪問速度至少可以提高5倍以上，對于頁面使用document的朋友絕對是個好方法。
2010-12-12
js實現(xiàn)仿Discuz文本框彈出層效果
這篇文章主要介紹了js實現(xiàn)仿Discuz文本框彈出層效果的方法,可實現(xiàn)點擊文本框彈出窗口選擇數(shù)據(jù)的效果,涉及鼠標事件及頁面自定義彈出窗口的相關(guān)操作技巧,需要的朋友可以參考下
2015-08-08
7. Microsoft Online-Crash Control, version 6.0(微軟在線崩潰控件)
7. Microsoft Online-Crash Control, version 6.0(微軟在線崩潰控件)...
2007-08-08
前端實現(xiàn)界面切換主題代碼示例
這篇文章主要介紹了前端實現(xiàn)界面切換主題的相關(guān)資料,文中介紹了兩種方法,通過link標簽的rel屬性和通過變量設(shè)置,前者適用于確定的主題樣式切換,后者則適用于在拾色器中任意選擇顏色更換主題的情況,需要的朋友可以參考下
2025-02-02
js中計算兩個日期間的工作日的簡單實例
下面小編就為大家?guī)硪黄猨s中計算兩個日期間的工作日的簡單實例。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2016-08-08
js this函數(shù)調(diào)用無需再次抓獲id，name或標簽名
this就是你當前要執(zhí)行的js所抓獲的節(jié)點，這樣在js里就可以不用document.getElement之類的寫法來抓獲id，name或標簽名，具體示例如下
2014-03-03
微信小程序動態(tài)修改頁面數(shù)據(jù)及參數(shù)傳遞過程詳解
這篇文章主要介紹了微信小程序動態(tài)修改頁面數(shù)據(jù)及參數(shù)傳遞過程詳解,文中通過示例代碼介紹的非常詳細，對大家的學習或者工作具有一定的參考學習價值,需要的朋友可以參考下
2019-09-09
JavaScript取得鼠標絕對位置程序代碼介紹
文章介紹了關(guān)于JavaScript在不同瀏覽器下取得鼠標絕對位置相關(guān)函數(shù)用法及兼容性介紹，有需要的同學可參考一下
2012-09-09
javascript實現(xiàn)簡單的頁面右下角提示信息框
本文給大家分享的是使用javascript實現(xiàn)簡單的頁面右下角提示信息框的方法和示例代碼，有需要的小伙伴可以參考下。
2015-07-07
Chrome Form多次提交表單問題的解決方法
第一次提交可以，第二次提交就沒有任何響應(yīng)了。需要重新加載頁面后才可以提交，而這個問題在Firefox,IE下沒有出現(xiàn)。
2011-05-05