değiştirme olayı radyo düğmesi klavye ile seçildiğinde

Question

<script> 
$("input[name='my_radio_button']").change(function(){ 
    if ($("input[@name='my_radio_button']:checked").val() == 'ONE'){ 
       do_this_stuff(); 
    } else { do_other_stuff(); } 
}); 
</script> 

<input type="radio" name="my_radio_button1" id="radio1" value="ONE" checked /> 
<input type="radio" name="my_radio_button2" id="radio2" value="TWO" /> 

değişiklik olayı bir radyo seçeneği belirlemek için tıklandığında ateş gibi görünüyor (bütün hazır olduğunda tam HTML ve ateşleme senaryoyu varsayalım), ancak ateş değil Seçim klavye ile değiştirildiğinde. Bu konuda herhangi bir şey yapılabilir mi?

düzenleme - bind veya live kullanıyorsam farketmez - bu sadece bir hatadır? Netleştirmek için, netlik kaybolduktan sonra bile etkinlik patlamaz.

düzenleme 2 - kimse bunun nedenini bilmiyor mu?

düzenlemek 3 - DonaldIsFreak belirttiği gibi bu odak kaybedene kadar, klavye ile değişti

Answer 1

İşte

güvenilir bir düzeltme http://evilstreak.co.uk/blog/fixing-change-events-on-radios

Ve bu size örnek ile bunu uygulamaya nasıl olduğunu kullanıyor: Ve burada FF3.6, IE8, Safari5 bu demo test http://www.jsfiddle.net/uDkdJ/1/ altında bir kod demo olduğunu , Chrome7 ve Opera10.65

$.fn.fix_radios = function() { 
    function focus() { 
    if (!this.checked) return; 
    if (!this.was_checked) { 
     $(this).change(); 
    } 
    } 

    function change(e) { 
    if (this.was_checked) { 
     e.stopImmediatePropagation(); 
     return; 
    } 
    $("input[name=" + this.name + "]").each(function() { 
     this.was_checked = this.checked; 
    }); 
    } 
    return this.focus(focus).change(change); 
} 

$(function() { 
    $("input[type=radio]").fix_radios(); 
    $("input[name='my_radio_button']").change(function(){ 
    if ($("input[@name='my_radio_button']:checked").val() == 'ONE'){ 
     do_this_stuff(); 
    } else { do_other_stuff(); } 
    }); 
}); 

Answer 2

Maalesef radyo düğmeleri değişim olaylarını kovma krom problemi gibi görünüyor. Bu soruna geçici bir çözüm bulmak isterseniz, her zaman durumu izleyen bir zamanlayıcı ayarlayabilir ve değişiklik yaptığında bir olay gönderebilirsiniz. gibi bir şey (yalancı kod): .keypress() aynı

Kullanım: bu benim jsfiddle ok tuşlarıyla devlet var değiştirmek için radyo düğmesini alma daha fazla şans sahip değilim

var monitorRadio = function(radio) 
{ 
    var state = $("input[@name='']:checked").val(); 
    $(radio).data("state", state); 
    var func = function() 
    { 
    var state = $("input[@name='']:checked").val(); 
    if (state != $(radio).data("state")) 
    { 
     $(radio).data("state", state); 
     // dispatch the change event 
     $(radio).change(); 
    } 
    setTimeout(100, func()); 
    }; 


    func(); 
} 

Answer 3

, işte kör bir cevabı odakli kutularını seçmek için geçerlidir kadar değişen değil hakkında kural ve başarıyla orada

http://api.jquery.com/keypress/

Answer 4

$("input[name='my_radio_button']").bind('change keypress', function(){ 
    if ($("input[@name='my_radio_button']:checked").val() == 'ONE'){ 
    do_this_stuff(); 
    } else { do_other_stuff(); } 
}); 

.keypress() kullandım

Bu yöntemdeki sorun, kullanıcının bir tuşa bastığında ve bir kez odağı kaybettiğinde olayın bir kez tetikleneceğidir. Eğer gerçekten değişti olmadığını bilmek kadar, bir önceki değer kontrol etmek ben do_this_stuff() ve do_other_stuff() ne emin değilim, ama onları bir kez bir sorun daha ateş varsa, bir var geçirerek çözeriz diye:

$("input[name='my_radio_button']").bind('change keypress', function(){ 
    if ($(this).value() != prevValue) { 
    if ($("input[@name='my_radio_button']:checked").val() == 'ONE'){ 
     do_this_stuff(); 
    } else { do_other_stuff(); } 
    } 
    prevValue = $(this).value(); 
}); 

Answer 5

jquery'de 1.4.2 @ selector çalışmıyor. Sizin için yararlı olup olmadığını görmek için bu örneğe bakın, "tıklama" başına "değişiklik" etkinliğini değiştirin.

html

<input type="radio" name="rdio" value="a" checked="checked" /> 
<input type="radio" name="rdio" value="b" /> 
<input type="radio" name="rdio" value="c" /> 

<br /> 

<div id="test"></div> 

javascript: ne var, İçinde sırayla, hiç çalışmıyor gibi olmamalı

$("input[name='rdio']").click(function(){ 
    if ($("input[name='rdio']:checked").val() == 'a') 
     $("#test").append("<div>a</div>"); 
    else if ($("input[name='rdio']:checked").val() == 'b') 
     $("#test").append("<div>b</div>"); 
    else 
     $("#test").append("<div>c</div>"); 
}); 

example
ref 1
ref 2