选中单选按钮显示一个div

我有这个标记我的网页之一，

<div class="radio-spoof">
    <input type="radio" name="enquiry" value="General enquiry" class="radio"/>
    <div class="checked"></div>
</div>
<label for="general_enquiry">General enquiry</label>
<div class="radio-spoof">
    <input type="radio" name="enquiry" value="Request a brochure" class="radio" checked="true"/>
    <div class="checked"></div>
</div>
<label for="request_a_brochure">Request a brochure</label>

基本上我正在做的是试图欺骗一些单选按钮，所以我可以有好看的，当收音机被选中时我想显示.checked设置为display:none默认display:none 。 我需要检查DOMReady上的一个选中的单选按钮，并且当单击收音机时，目前我有这个页面，但它似乎没有正确地选择.checked div。

if($('input[type=radio]:checked')) {
console.log("!");
$(this).parent().children('div').show();
}

我期望上面的代码选择单选按钮父，然后寻找一个孩子div（.checked）并显示它。 我错了吗？ `

---

$(function(){
  $(':radio').change(function(){
    var $this = $(this);
    console.log($this);
    $(':radio[name='+this.name+']').next().hide();
    if($this.is(':checked')){
      $this.next('.checked').show();
    }
  });
});

---

对于上述问题，我已经完成了codebins的解决方案。 所以，请尝试http://codebins.com/codes/home/4ldqpb6

解：

$(document).ready(function() {
    $('input[type=radio]').each(function() {
        if ($(this).is(':checked')) {
            $(this).next('.checked').show();
        }
        $(this).click(function() {
            if ($(this).is(':checked')) {
                $(this).next('.checked').show();
            }
        });
    });
});

---

演示您需要在复选框状态更改时注册一个事件：http://jsfiddle.net/FtPLS/2/ 或 http://jsfiddle.net/QCkpG/1/

另外我认为你应该使用.next而不是.children 。

如果你想隐藏.checked只需要这样做=> $('.checked').hide()

您可以使用$('input[type=radio]').is(':checked')来检查/取消选中条件。

希望这有助于事业， :)

码

$(function() {
    // here ==> $('.checked').hide(); will hide all the div with checked class
    $('input').click(function() { // can use .change instead if you want
        if ($('input[type=radio]').is(':checked')) {
            alert('!')
            $(this).parent().next('div').show(); // whatever you wanna show or 
            //$(this).next('div').show();
        }
    });
});​

链接地址: http://www.djcxy.com/p/56007.html

上一篇: checked radio button show a div

下一篇: How to change progress bar with creating dynamic checkboxes