javascript - 选中 radio 时添加必需属性

Question

我有一组名为“价格”的单选按钮。选择“€”单选按钮后，我想关注一个文本输入字段，并且该文本输入字段应该是必需的。 当我单击另一个选项时，应该删除所需的属性。

这可以通过 Javascript 或 jQuery 实现吗？ 我在这里找到了一个 jQuery 片段，但它似乎不起作用。这就是我现在拥有的:

<input type="radio" name="price" value="value" id="value_radio" onclick="document.getElementById('value_input').focus()" required>

<label for="value_input">&euro;</label>
<input type="text" name="price_value" id="value_input" pattern="\d+(,\d{1,2})?" 
    onclick="document.getElementById('value_radio').checked=true">

<script>
    $('#value_radio').change(function () {
        if($(this).is(':checked')) {
            $('#value_input').attr('required');
        } else {
            $('#value_input').removeAttr('required');
        }
    });
</script>

<input type="radio" name="price" id="free" value="free">
<label for="free">Free</label>

JSFiddle:http://jsfiddle.net/fhfrzn1d/

Answer 1

根据 this answer ，您必须监视两个 radio 输入的变化。因此，将您的 javascript 脚本移到第二个广播之后。

还缺少一个)

fiddle 更新:http://jsfiddle.net/fhfrzn1d/1/

$('input[name="price"]').change(function () {
    if($("#value_radio").is(':checked')) {
        $('#value_input').attr('required', true);
    } else {
        $('#value_input').removeAttr('required');
    }
});