Question

我想隐藏div，直到选中租用的单选按钮。此div包含仅相对于租用无线电选择的输入字段，因此在选择拥有的单选按钮时隐藏它们是首选。但是，我的代码不起作用。

HTML

<div id="surv_radio4">
    <p>
        Merchant Site Property is
    </p>
    <input type="radio" id="owned" value="owned" name="merchant_property"/>
    <label for="owned">Owned</label>
    <input type="radio" id="leased" value="leased" name="merchant_property"/>
    <label for="leased">Leased</label>
</div>
<div id="surv_5">
    <label for="landlord_name" class="test">Landlord Name</label>
    <input type="text" id="landlord_name" placeholder="Landlord Name"/>
    <label for="landlord_phone">Phone Number</label>
    <input type="text" id="landlord_phone" placeholder="XXX-XXX-XXXX"/>
</div>

CSS

#surv_5 {
    display: none;
}

的Javascript

<script>
$(document).ready.(function() {
    $("input[name$='merchant_property']").click(function() {
        var value = $(this).val();
        if (value == 'leased') {
            $("#surv_5").show();
        } else if (value == 'owned') {
            $("#surv_5").hide();
        }
    });
});
</script>

Answer 1

您的document.ready函数有语法错误（额外句点）：

$(document).ready(function () {

http://jsfiddle.net/isherwood/tW3D5/

Answer 2

试试这个：

$("input[name$='merchant_property']").change(function () {
    var value = $(this).val();    
    if (value == 'leased') {        
        $("#surv_5").show();
    } else {
        $("#surv_5").hide();
    }
});

<强> Fiddle here.

Answer 3

在您的原始代码中，您的其他声明中也有错误。 See fiddle here

以下相关位：

if (value == 'leased') {
  $("#surv_5").show();
} else if(value == 'owned'){
  $("#surv_5").hide();
}

<强>更新

太晚了，看起来像@Hiral有你的答案....

在单选按钮检查上显示div

3 个答案: