jQuery

Question

jQuery 不是我的强项:-) 我不知道如何将新功能添加到我的函数中。我想在 html 中显示隐藏的 div 当无线电值为检查。现在，当我单击单选按钮时，脚本显示 div：

<script type="text/javascript">
    $(document).ready(function(){
      $('input[type="radio"]').click(function(){
        var inputValue = $(this).attr("value");
        var targetBox = $("." + inputValue);
        $(".box").not(targetBox).hide();
        $(targetBox).show();
      });
    });
</script>

Answer 1

单选按钮是否被选中，你可以用这个检查

if( $(".radio").prop("checked") ) {
    /*means that is checked*/
}

请参阅下面的代码片段

    $(document).ready(function(){
      $('input[type="radio"]').click(function(){
        if( $(this).prop("checked") ) {
            var inputValue = $(this).attr("value");
            var targetBox = $("." + inputValue);
            $(".box").not(targetBox).hide();
            $(targetBox).show();
       }
      });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
AA - <input type="radio" name="test" value="aa" /><br>
BB - <input type="radio" name="test" value="bb" /><br>
CC - <input type="radio" name="test" value="cc" /><br>

<div class="box aa" style="display: none">BOX AA</div>
<div class="box bb" style="display: none">BOX BB</div>
<div class="box cc" style="display: none">BOX CC</div>

Answer 2

您的建议无效，请检查下面的代码段。选中的是标记，但未显示 DIV - 您必须点击它

    $(document).ready(function(){
      $('input[type="radio"]').click(function(){
        if( $(this).prop("checked") ) {
            var inputValue = $(this).attr("value");
            var targetBox = $("." + inputValue);
            $(".box").not(targetBox).hide();
            $(targetBox).show();
       }
      });
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
AA - <input type="radio" name="test" value="aa" checked="checked"/><br>
BB - <input type="radio" name="test" value="bb" /><br>
CC - <input type="radio" name="test" value="cc" /><br>

<div class="box aa" style="display: none">BOX AA</div>
<div class="box bb" style="display: none">BOX BB</div>
<div class="box cc" style="display: none">BOX CC</div>

jQuery - 选中的单选按钮

jQuery - checked radio button

button

radio-button

checked