javascript - jQuery 在点击 if 语句时生成的文本，在 if 为 false 后仍然存在

Question

我有一个表单，里面有一些单选按钮。单击链接时，所选单选按钮的值将传递到文本字段。如果该值为“0”，则会向 div 提供文本“不需要”，覆盖如果输出不是“0”时的输出位置。

当您单击“0”单选按钮然后单击链接时，它会正常工作。问题是，如果您更改为不同的单选按钮，然后再次单击该链接，文本仍然存在。我想要发生的是该消息仅在选择“0”时出现，如果选择非“0”则将其删除。

我已经在 http://jsfiddle.net/thewebdes/gnW2c/ 上设置了它所以你可以明白我的意思。在实际项目中，“不需要”文本将覆盖任何其他可能出现的内容，因此在点击功能开始时使用 jquery 清除 html 是不行的。

HTML

<form action="#" method="post">
    <label for="item1_qty1">0</label>
    <input type="radio" id="item1_qty1" name="item1_qty" value="0">
    <br>
    <label for="item1_qty1">100</label>
    <input type="radio" id="item1_qty1" name="item1_qty" value="100">
    <br>
    <label for="item1_qty1">250</label>
    <input type="radio" id="item1_qty1" name="item1_qty" value="250">
    <br>
    <label for="item1_qty1">500</label>
    <input type="radio" id="item1_qty1" name="item1_qty" value="500">

    <a href="javascript:;" class="gen_output">Get Value</a>

    <div class="output">
        <label for="item1_qty_output">Item 1 Output</label>
        <input type="text" id="item1_qty_output">
    </div>
</form>

JS

$('.gen_output').click(function() {
    $('#item1_qty_output').val($('input:radio:checked').val());
    if ($('input:radio:checked').val() == '0') {
        $('.output').html('Not required')
    }
});

Answer 1

我认为这就是您想要的 - http://jsfiddle.net/ntTcr/

当值为 0 时，您正在替换输出 div 的全部内容，因此当您选择不同的值时无法取回它。