Захват RadioButton нажми и действуй

Question

У меня есть 3 радио кнопки на моей странице. Есть 3 кнопки также на той же странице. я хочу показать разные кнопки при нажатии на каждую.

<input id="Radio1" type="radio" name="grp1" class="abc" />
<input id="Radio2" type="radio" name="grp1" class="abc" />
<input id="Radio3" type="radio" name="grp1" class="abc" />

Обновление: для каждой радиокнопки должна отображаться только одна кнопка. Например: если нажата кнопка "Radio1", показывается кнопка 1, если нажата кнопка "Radio 2", отображается кнопка 2 и т. Д.

Answer 1

$(function() { // at dom ready
  $('input.abc').change(function() { // on radio's change event
    $('.buttons-to-hide-class').hide(); // hide buttons
    $('#button-to-show-id').show(); // show desired button
  });
});

Answer 2

Я думаю, что то, что предлагает Ники Де Майер, лучше, и я уверен, что есть лучший способ кодирования таким образом, но:

скрипт

$(function() {
    //hide all the buttons when the page loads
    $('.def').hide(); 
    //add an onchange function to each radiobutton
    $('input.abc').change(function() { 
        //hide all the other buttons
        $('.def').hide(); 
        //construct the ID of the button to show and show it
        $('#' + this.id + '-Button').show()
        });
    });

HTML

<input id="Radio1" type="radio" name="grp1" class="abc" />
<input id="Radio2" type="radio" name="grp1" class="abc" />
<input id="Radio3" type="radio" name="grp1" class="abc" />

<input id="Radio1-Button" type="button" value="1" class="def" ></input>
<input id="Radio2-Button" type="button" value="2" class="def" ></input>
<input id="Radio3-Button" type="button" value="3" class="def" ></input>

Answer 3

$('#Radio1').click(function() { $('#button1').value = 'new value'; });

что-то вроде того

Answer 4

Вы пытаетесь

Click()

или, может быть

change()

должно сработать:)