1

我正在尝试根据单选按钮的选择制作一些显示两个 div 之一的东西。就单选按钮而言，我有以下代码：

<input type="radio" name="radio-269" value="Purchase Only" />
<input type="radio" name="radio-269" value="Sale Only" />
<input type="radio" name="radio-269" value="Purchase and Sale" />

然后我的DIV：

<div id="purchaseandsale" class="hidden" style="padding-top:10px; padding-bottom:10px; background-color: grey;">
Purchase and Sale
</div>

<div id="purchaseorsale" class="hidden" style="padding-top:10px; padding-bottom:10px; background-color: grey;">
Purchase or Sale
</div>

我的Javascript：

<script>
$("select[name='radio-269']").change(function() {
    if ($(this).val() == "Purchase and Sale") {
       $('#added_fields').removeClass("hidden");
    }
    else {
        $('#added_fields').addClass("hidden");
    }
});
</script>

首先，它不起作用并且不会在控制台中给我一个错误。如果显示“购买”或“销售”单选按钮，我怎样才能让它显示 purcahseorsale div？

4

1 回答 1

2

您应该指的是input[name='radio-269']而不是input[select='radio-269'].

此外，您的 ID 选择器与实际 DOM 的选择器不匹配。

JavaScript 应该是：

$("input[name='radio-269']").change(function() {
    if ($(this).val() == "Purchase and Sale") {
       $('#purchaseandsale').removeClass("hidden");
    }
    else {
        $('#purchaseandsale').addClass("hidden");
    }
    if ($(this).val() == "Purchase Only" || $(this).val() == "Sale Only") {
       $('#purchaseorsale').removeClass("hidden");
    }
    else {
        $('#purchaseorsale').addClass("hidden");
    }
});

检查这个 JS 小提琴：http: //jsfiddle.net/MrXenotype/ZpP7f/

于 2012-12-04T20:41:45.470 回答