基于jquery中的select值显示表单字段

我想根据初始选择值的类别显示一个div id。理想情况下，所有div最初都是隐藏的，只有ID与select下拉列表的类匹配的div才会显示。因此，下面的选择A或D都将显示div ID A

我当前的代码如下所示：`

<select name="milestone_tag" id="milestone_tag"
  <option value="1" class="a">Selection A
  <option value="2" class="b">Selection B</option>
  <option value="3" class="a-b">Selection C</option>
  <option value="4" class="a">Selection D</option>
</select>
<div id="a">
  <input name="milestone_a" />
</div>
<div id="b">
  <input name="milestone_b" />
<div id="a-b">
  <input name="milestone_a" />
  <input name="milestone_b" />
</div>

$('#milestone_tag').change(function() {
$("#a,#b,#a-b").hide();
$($(this).find('option:selected').attr('class')).show();
});

---

任何帮助都将不胜感激

类选择器如下所示。class while.attr返回不带..的类。。因此，这一行：

$($(this).find('option:selected').attr('class')).show();

必须是这样才能工作：

$("." + $(this).find('option:selected').attr('class')).show();

---

类选择器如下所示。class while.attr返回不带..的类。。因此，这一行：

$($(this).find('option:selected').attr('class')).show();

必须是这样才能工作：

$("." + $(this).find('option:selected').attr('class')).show();

---

您只需要传入选项的类名，您需要在其前面加上选择器类型。在本例中，是div的id

你基本上就是这么做的 $a.show；当需要为$a.时，显示

---

您只需要传入选项的类名，您需要在其前面加上选择器类型。在本例中，是div的id

你基本上就是这么做的 $a.show；当需要为$a.时，显示

---

我会尝试以下几点：

<select name="milestone_tag" id="milestone_tag">
    <option value="1" class="a">Selection A</option>
    <option value="2" class="b">Selection B</option>
    <option value="3" class="a-b">Selection C</option>
    <option value="4" class="a">Selection D</option>
</select>
<div id="a" class="milestone">
    <input name="milestone_a" value="milestone a" />
</div>
<div id="b" class="milestone">
    <input name="milestone_b" value="milestone b" />
</div>
<div id="a-b" class="milestone">
    <input name="milestone_a" value="milestone a" />
    <input name="milestone_b" value="milestone b" />
</div>

$(document).ready(function(){
    var $milestones = $(".milestone"),
        $selector = $('#milestone_tag');

    $selector.change(function() {
        var selected = $selector.find('option:selected').attr('class');

        $milestones.hide();
        $('#' + selected + '.milestone').show();
    });
});

一个稍微复杂一些的示例，首先使用相关的id选择器（逗号分隔）测试并创建本地数据值，然后使用显示相关元素。注意使用了一个不存在的c，并且a和b在a-b情况下不是重复的

---

我会尝试以下几点：

<select name="milestone_tag" id="milestone_tag">
    <option value="1" class="a">Selection A</option>
    <option value="2" class="b">Selection B</option>
    <option value="3" class="a-b">Selection C</option>
    <option value="4" class="a">Selection D</option>
</select>
<div id="a" class="milestone">
    <input name="milestone_a" value="milestone a" />
</div>
<div id="b" class="milestone">
    <input name="milestone_b" value="milestone b" />
</div>
<div id="a-b" class="milestone">
    <input name="milestone_a" value="milestone a" />
    <input name="milestone_b" value="milestone b" />
</div>

$(document).ready(function(){
    var $milestones = $(".milestone"),
        $selector = $('#milestone_tag');

    $selector.change(function() {
        var selected = $selector.find('option:selected').attr('class');

        $milestones.hide();
        $('#' + selected + '.milestone').show();
    });
});

一个稍微复杂一些的示例，首先使用相关的id选择器（逗号分隔）测试并创建本地数据值，然后使用显示相关元素。注意使用了一个不存在的c，并且a和b在a-b情况下不是重复的

---

您需要添加选择器，让jQuery知道您希望它是类或id，因为不添加选择器，只添加属性的值：

$('.' + $(this).find('option:selected').attr('class')).show();

对于id：

---

希望这有帮助。

您需要添加选择器，让jQuery知道您希望它是类或id，因为不添加选择器，只添加属性的值：

$('.' + $(this).find('option:selected').attr('class')).show();

对于id：

---

希望这有帮助。

您忘了在选择器前面。使用jQuery代码的良好实践

$document.ready

---

你忘了在选择器前面。使用jQuery代码的良好实践

$document.ready