奇數行爲檢測與JavaScript

複選框變化時，我有以下的HTML代碼：奇數行爲檢測與JavaScript

<label class="radio"> 
    <input type="radio" name="msgTo" value="optiona" checked="checked"> 
    <i></i>Option A</label> 
<label class="radio"> 
    <input type="radio" name="msgTo" value="optionb"> 
    <i></i>Option B</label> 
<label class="radio"> 
    <input type="radio" name="msgTo" value="optionc"> 
    <i></i>Option C</label> 
<label class="radio"> 
    <input type="radio" name="msgTo" value="optiond"> 
    <i></i>Option D</label> 
<label class="radio"> 
    <input type="radio" name="msgTo" value="optione"> 
    <i></i>Option E</label>

，我想這取決於哪個選項與此代碼檢查，做的東西：

$('input[name="msgTo"]:checked').on('change', function() { 

    alert('option changed'); 

    if ($('input[name="msgTo"]:checked').val() == 'optionc') { 

     $('#outsideMsgWarning').show(); 
     $('#destEspecificos').hide(); 
     $('#locEspecificas').hide(); 

    } else if ($('input[name="msgTo"]:checked').val() == 'optiond') { 

     $('#outsideMsgWarning').show(); 
     $('#destEspecificos').hide(); 
     $('#locEspecificas').show(); 
     $('.my_select_box').trigger('chosen:updated'); 

    } else if ($('input[name="msgTo"]:checked').val() == 'optione') { 

     $('#outsideMsgWarning').show(); 
     $('#destEspecificos').hide(); 
     $('#locEspecificas').hide(); 

    } else if ($('input[name="msgTo"]:checked').val() == 'optionb') { 

     $('#outsideMsgWarning').hide(); 
     $('#destEspecificos').show(); 
     $('#locEspecificas').hide(); 
     $('.my_select_box').trigger('chosen:updated'); 

    } else { 

     $('#outsideMsgWarning').hide(); 
     $('#destEspecificos').hide(); 
     $('#locEspecificas').hide(); 
     $('.my_select_box').trigger('chosen:updated'); 

    } 

});

當我選擇第二，第三，第四或第五選項時，沒有任何反應（應該隱藏/顯示一些選項），但是當我回到第一個選項時（這將是javascript中的ELSE），將顯示警報。警報僅用於測試目的。

我也嘗試添加括號[]到複選框名稱，但得到了相同的結果。

爲什麼JavaScript不檢測每個變化？

在此先感謝！

來源

2017-05-04 CesarA

刪除'。 ** [示例]（https://jsfiddle.net/wcfjxqq5/）** – empiric

@empiric是對的。順便說一句 - 你可以使用[開關]（https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Statements/switch），而不是「無盡的」，否則如果' –

Thenks經驗豐富！就是這樣！：d – CesarA

你的，設置了事件最初選擇綁定只想找那個被檢查單選按鈕：

$('input[name="msgTo"]:checked').on('change', function() {

由於第一個單選按鈕默認情況下，預籤，只有一個會受到影響。

行更改爲：

$('input[name="msgTo"]').on('change', function() {

因此，該組中的所有單選按鈕獲取綁定到事件處理程序。

來源

2017-05-04 14:21:33

更改onchange事件這樣$('input[name="msgTo"]').on('change', function()。您應該刪除:checked

$('input[name="msgTo"]').on('change', function() { 
 
if($(this).is(':checked')){ 
 
    alert('option changed'); 
 
} 
 
    if ($('input[name="msgTo"]:checked').val() == 'optionc') { 
 

 
    $('#outsideMsgWarning').show(); 
 
    $('#destEspecificos').hide(); 
 
    $('#locEspecificas').hide(); 
 

 
    } else if ($('input[name="msgTo"]:checked').val() == 'optiond') { 
 

 
    $('#outsideMsgWarning').show(); 
 
    $('#destEspecificos').hide(); 
 
    $('#locEspecificas').show(); 
 
    $('.my_select_box').trigger('chosen:updated'); 
 

 
    } else if ($('input[name="msgTo"]:checked').val() == 'optione') { 
 

 
    $('#outsideMsgWarning').show(); 
 
    $('#destEspecificos').hide(); 
 
    $('#locEspecificas').hide(); 
 

 
    } else if ($('input[name="msgTo"]:checked').val() == 'optionb') { 
 

 
    $('#outsideMsgWarning').hide(); 
 
    $('#destEspecificos').show(); 
 
    $('#locEspecificas').hide(); 
 
    $('.my_select_box').trigger('chosen:updated'); 
 

 
    } else { 
 

 
    $('#outsideMsgWarning').hide(); 
 
    $('#destEspecificos').hide(); 
 
    $('#locEspecificas').hide(); 
 
    $('.my_select_box').trigger('chosen:updated'); 
 

 
    } 
 

 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<label class="radio"> 
 
    <input type="radio" name="msgTo" value="optiona" checked="checked"> 
 
    <i></i>Option A</label> 
 
<label class="radio"> 
 
    <input type="radio" name="msgTo" value="optionb"> 
 
    <i></i>Option B</label> 
 
<label class="radio"> 
 
    <input type="radio" name="msgTo" value="optionc"> 
 
    <i></i>Option C</label> 
 
<label class="radio"> 
 
    <input type="radio" name="msgTo" value="optiond"> 
 
    <i></i>Option D</label> 
 
<label class="radio"> 
 
    <input type="radio" name="msgTo" value="optione"> 
 
    <i></i>Option E</label>

來源

2017-05-04 14:22:28 prasanth

您選擇檢查輸入。

$('input[name="msgTo"]:checked')

試試這個選擇來代替：從事件處理程序的選擇checked`，還應該考慮緩存你的元素：

$('input[name="msgTo"]')

來源

2017-05-04 14:22:33

奇數行爲檢測與JavaScript

回答

相關問題