我需要一個單選按鈕的事件觸發器，當它被取消選中時，因爲另一個按鈕被選中

我需要一個單選按鈕的事件觸發器，當它被取消選中時，因爲選中了另一個按鈕。我需要一個單選按鈕的事件觸發器，當它被取消選中時，因爲另一個按鈕被選中

下面的代碼應該證明我的困境。

如果您會注意到，在html代碼中有一個附加到每個單選按鈕和複選框的onchange事件觸發器。理論上，狀態從檢查到未檢查的變化應該觸發onchange事件。

這種情況與複選框的預期一樣。如果您選中一項，則會收到提醒，「您的商品已更改爲已確認」。如果您取消選中它，您會收到提醒，「您的商品已更改爲未選中」。

使用單選按鈕，當您檢查按鈕之一時，您會收到警報'您的項目更改爲已檢查'，因爲該按鈕已從未選中更改爲已檢查。但是，當您檢查第二個按鈕並且第一個單選按鈕從選中變爲未選中時，「onchange」事件觸發器不會觸發，並且未觸發「其他」警報。

所以這個問題對我來說是什麼事件被觸發時，一個單選按鈕變得不被選中的另一個按鈕被檢查？

我感謝大家對此的幫助。

--Kenoli

<html> 
<head> 
<title></title> 

<script type="text/javascript"> 

function clickAction() { 

    //alert ('Your item changed'); 

    if (this.checked == true) {alert ('Your item is changed to checked');} 

    else if (this.checked == false) {alert('Your item is changed to unchecked');} 

} 



</script> 

<script type="text/javascript"> 

function initializeToggles() { 

    var button1= document.getElementById('button1'); 
    button1.onchange = clickAction; 

    var box1= document.getElementById('box1'); 
    box1.onchange = clickAction; 

    var box2= document.getElementById('box2'); 
    box2.onchange = clickAction; 

} 

</script> 

<script type="text/javascript">window.onload = initializeToggles;</script> 

</head> 
<body> 

<input type="radio" name="testRadio" id="button1" >Button one<br/> 
<input type="radio" name="testRadio" id="button2" >Button two<br/><br/> 

<input type="checkbox" name="testCheckbox" id="box1" >Box one<br/> 
<input type="checkbox" name="testCheckbox" id="box2" >Box two<br/><br/> 

</body> 
</html>

來源

2010-09-24 Kenoli Oleari

沒有爲當一個單選按鈕選中得到任何事件。您可能可以使用onpropertychange事件，但這不是標準化事件，因此它只能在Internet Explorer中使用。

最安全的方法是在onchange事件中處理這件事。如果你想知道哪個單選按鈕沒有被選中，你將不得不在一個變量中保留對當前選中元素的引用。

來源

2010-09-24 21:01:24 Guffa

謝謝。這回答了我的問題。我想我可以創建一個'checked'元素的變量，並通過它來重置這些元素。似乎有這麼多的AJAX這些天，一個「onunset」事件取消選中一個單選按鈕將是有用的 – 2010-09-24 22:02:37

我來到這裏尋找這種類型的問題，一個快速的解決方案，以及國統會的回答幫我想出了這一點：

$(document).ready(function(){ 
    $('input[type=radio]').change(function() { 
    var selected = $(this); 
    $('input[type=radio]').each(function() { 
     if $(this).attr('id') != selected.attr('id') { 
     console.log($(this).attr('value') + ' was deselected because ' + selected.attr('value') + ' was clicked.') 
     } 
    }); 
    }); 
});

來源

2012-05-31 01:51:23 rthbound

這實際上不適用於多個廣播組 - 你需要檢查name屬性，以確保它們實際上 – 2013-01-08 20:21:12

你是對的......它需要一些細微的修改，如果你已經修改了它來處理多個團體，可以自由編輯答案。 – rthbound 2013-01-08 23:50:49

我稍微修改rthbound的代碼來處理一組無線輸入的，在我情況附於<table>。但是這可以很容易地改變爲<div>。此外這個代碼更符合jQuery 1.9。一個普通的類會更好，從選定的收音機中選擇類，並找到同一類的其他廣播輸入，但我正在使用ASP.NET，這對我來說更快更簡單。

$(document).ready(function(){ 
    $(document).on("change", "input[type='radio']", function() { 
     var selected = $(this); 
     $(this).closest("table").find("input[type='radio']").each(function() { 
      if ($(this).attr("id") !== selected.attr("id")) { 
       console.log($(this).attr("value") + " was deselected because " + selected.attr("value") + " was clicked."); 
      } 
     }); 
    }); 
});

來源

2013-02-15 15:29:46 radiok

我已經解決了這個問題的一般方法：

每當一個單選按鈕改變：

，如果他們通過這個系統觸發 - 我們不想無休止的循環。
找到他們所有的單選按鈕的朋友
觸發變化

然後我可以測試單選按鈕是否被選中或取消選中。

$(function(){ 
    $('body').on('change', 'input[type="radio"]', function(e, by_other) { 
     if (!by_other) { 
      $("input[type='radio'][name='" + $(this).attr('name') + "']") 
      .not(this) 
      .trigger('change', true) 
     } 
    } 
}

（我做了它的CoffeeScript給JavaScript爲你們大家翻譯。）

來源

2013-03-21 21:06:20 robotdana

單選按鈕具有相同的名稱，因此我們可以通過名稱來選擇它們。因爲.change()不受影響，所以我們使用.click()而不是。

$('input[name="your-radio-name"]').click(function() { 
    var $radios = $('input[name="your-radio-name"]'); 
    for (var i = 0; i < $radios.length; i++) { 
     var radio = $radios[i]; 
     if (radio != this) { 
      radio = $(radio); 
      // Process for unchecked radios here 
     } 
    } 

    // Now, process for checked radio 
    // alert(this.value + ' is checked'); Or 
    alert($(this).val() + ' is checked'); 
});

來源

2013-07-08 11:56:15

我需要一個單選按鈕的事件觸發器，當它被取消選中時，因爲另一個按鈕被選中

回答

相關問題