根据单选框的选择更改文本框的值

Question

我正在尝试根据4个单选按钮的选择来更改文本框的值。以下并非实际HTML代码，而是简化版本：

    <input type="radio" name="radiogroup" id="radiogroup" value="5" />
    <input type="radio" name="radiogroup" id="radiogroup" value="10" />
    <input type="radio" name="radiogroup" id="radiogroup" value="15" />
    <input type="radio" name="radiogroup" id="radiogroup" value="20" />

    <input type="text" name="amount" id="amount" />

我想要做的是根据选中的单选按钮，向名为“amount”的文本框中填入5、10、15或20。

我刚接触jquery，尝试过的所有方法都无效。

非常感谢您提供的任何帮助。

cdr6545

- cdr6800

Answer 1

你可以通过添加类轻松实现这一点。

工作中的Fiddle HTML：

    <input type="radio" name="radiogroup" id="radiogroup" class="radiogroup" value="5" />
    <input type="radio" name="radiogroup" id="radiogroup" class="radiogroup" value="10" />
    <input type="radio" name="radiogroup" id="radiogroup" class="radiogroup" value="15" />
    <input type="radio" name="radiogroup" id="radiogroup" class="radiogroup" value="20" />

    <input type="text" name="amount" id="amount" />

JS：

$('.radiogroup').change(function(e){
    var selectedValue = $(this).val();
    $('#amount').val(selectedValue)
});

- Mehmood

Answer 2

ID是唯一的，每个ID只能在当前文档中用于一个元素，因此将其更改为类。

然后将change事件处理程序附加到单选按钮上，获取选中的单选按钮，并将文本输入的值设置为选中单选按钮的值。

$('.radiogroup').on('change', function() {
  $('#amount').val( this.value );
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<input type="radio" name="radiogroup" class="radiogroup" value="5" />
<input type="radio" name="radiogroup" class="radiogroup" value="10" />
<input type="radio" name="radiogroup" class="radiogroup" value="15" />
<input type="radio" name="radiogroup" class="radiogroup" value="20" />
<br /><br />
<input type="text" name="amount" id="amount" />

- adeneo

Answer 3

类似这样的：

$('input[name="radiogroup"]').click(function()
{
    $('#amount').val($(this).val())
})

- MisterDebug