Jquery 基于选择框显示/隐藏div

关于这一点，这里有很多答案，我试着修改它们以适应，但它不起作用

我为它做了一个JSFIDLE：

选择框代码：

<div class="options">
    <h2>Available Options</h2>
    <br />
    <div id="option-230" class="option">
        <span class="required">*</span>
        <b>Size:</b><br />
        <select name="option[230]">
            <option value=""> --- Please Select --- </option>
            <option value="28">Size 10                        </option>
            <option value="29">Size 12                        </option>
            <option value="30">Size 14                        </option>
            <option value="32">Size 16                        </option>
            <option value="31">Size 18                        </option>
            <option value="117">Made to Measure                        </option>
        </select>
    </div>
    <br />
    <div id="option-253" class="option">
        <b>Bust (cm):</b><br />
        <input type="text" name="option[253]" value="" class="input-text" />
    </div>
    <br />
    <div id="option-254" class="option">
        <b>Waist (cm):</b><br />
        <input type="text" name="option[254]" value="" class="input-text" />
    </div>
    <br />
    <div id="option-255" class="option">
        <b>Hips (cm):</b><br />
        <input type="text" name="option[255]" value="" class="input-text" />
    </div>
    <br />
</div>

---

谢谢

您正试图在jquery中选择没有id的选项

首先，在选择控件上定义

Id

，如下所示

 <select name="option[230]" id="option--230">

然后用作

jQuery('select[name="option[230]"]').change(function () {
    if ($(this).val() == '117') {
        $('#option-253').show();
        }
    else $('#option-253').hide();
});

---

您的选择器错误。您使用的选择器将选择id为option且属性为230的元素，如

。

在这种情况下，您可以使用

选择

元素的

名称

作为选择器，如下所示

var MTM = jQuery('select[name="option[230]"]');
MTM.change(function () {
    $('#option-253').toggle(this.value == 117);
    $('#option-254').toggle(this.value == 117);
    $('#option-255').toggle(this.value == 117);
}).change();

---

演示：

有什么问题？你的问题是什么？不要只在这里转储代码，期望我们找出您的问题所在。

var MTM=jQuery（'[name=“option[230]”）是您的问题，请修复选择器@j08691对不起，我是新来的，上次我问了一个问题，所有的解释都被删掉了，所以只剩下代码。。我想这就是我应该做的。谢谢你的快速回复。名称和ID是由创建代码的软件（opencart）生成的，因此我必须在脚本中使用它生成的内容。谢谢，这几乎是完美的！现在唯一的问题是，div显示在页面加载上。一旦你在下拉列表中选择了一个选项，它们就会消失，但我需要它们在加载时被隐藏。我正在尝试使用CSS进行显示：无，但没有效果。JS是否覆盖了它？这非常有效！我现在要做的是将其修改为更通用的（因为选择器对于每个产品都会更改，“117”值也会更改）。我做了一个新的提琴来尝试解决这个问题，但是this.html和this.innerhtml似乎不起作用。请你看一下好吗？
jQuery('select[name="option[230]"]').change(function () {
    if ($(this).val() == '117') {
        $('#option-253').show();
        }
    else $('#option-253').hide();
});

var MTM = jQuery('select[name="option[230]"]');
MTM.change(function () {
    $('#option-253').toggle(this.value == 117);
    $('#option-254').toggle(this.value == 117);
    $('#option-255').toggle(this.value == 117);
}).change();