Jquery 根据下拉选择显示文本

如何读取所选选项并根据选项显示

div

：

<select>
    <option value="1">Package 1</option>
    <option value="2">Package 2</option>
    <option value="3">Package 3</option>
    <option value="4">Package 4</option>
    <option value="5">Package 5</option>
    <option value="6">Package 6</option>
</select>

包1
方案2
方案3
方案4
方案5
方案6

---

如果您可以查看此小提琴并在其中集成代码：

您应该向

选择
元素添加一个id。例如：

<select id="optionsPackage" .../>

HTML:

如果您还希望在他们更改选择时更新它

JS小提琴：


包1
方案2
方案3
方案4
方案5
方案6
$（'#myselect'）.change（function（）{
var val=$（this.val（）；
$（'.output'）.html（'package'+val）；
});

将抓住价值

然后假设您有6个ID为“Package-X”的隐藏div，其中X是一个数字

您可以简单地执行以下操作：

$('#Package-' + $('select').val()).show();

你不需要像Icarus建议的那样在你的选择上使用ID，但是代码会更干净更好，因为不可能抓住错误的select元素。
你能在JSFIDLE中集成你的代码吗：@user3025379这里：-注意我添加的新div和
select.change
函数。这是可行的，但你能将它应用到你的每一个重复上吗添加
<select id="myselect">
        <option value="1">Package 1</option>
        <option value="2">Package 2</option>
        <option value="3">Package 3</option>
        <option value="4">Package 4</option>
        <option value="5">Package 5</option>
        <option value="6">Package 6</option>
    </select>

value = $( "#myselect" ).val();

<select id="myselect">
    <option value=""></option>
        <option value="1">Package 1</option>
        <option value="2">Package 2</option>
        <option value="3">Package 3</option>
        <option value="4">Package 4</option>
        <option value="5">Package 5</option>
        <option value="6">Package 6</option>
    </select>

<div class='output'></div>

    <script>
$('#myselect').change(function(){
            var val = $(this).val();

                $('.output').html('package ' + val);   

        });
</script>

$('select').val();

$('#Package-' + $('select').val()).show();