当我从ddl中选择选项时,同一类的div是不可见的,所以当我从ddl中选择选项时,我想要显示特定选项的div。
在我的选择中,选项值来自数据库(1.mobile,2.email),所以我想在选择移动设备时出现div编号1。
$(function() {
$('#theme').change(function() {
$('#number' + $(this).val('mobile')).show();
}).change();
});
<label for="mode">Communication Mode :</label>
<?php
echo "<select name='ddlmode' id='theme' required >";
echo "<option>-select-</option>";
include "configpdo.php";
$stmt = $conn->prepare( "select value from key_master where ems_key='k006' or ems_key='k007'" );
$stmt->execute();
$result = $stmt->fetchAll();
foreach ( $result as $row ){
echo "<option>" . $row[ "value" ] . "</option>";
}
echo "</select>";
?>
<div id="number1" class="box">
<label for="sms">SMS text</label>
<textarea rows="15" cols="80"></textarea>
</div>
<div id="number2" class="box">
<label for="mail">Mail :/label>
<label for="subject">Subject</label>
<textarea rows="2" cols="80"></textarea>
<label for="email" style="font-size: 20px;">Body</label>
<textarea rows="15" cols="80"></textarea>
</div>
答案 0 :(得分:0)
假设您的select
html是这样的
<select>
<option value="0">Select</option>
<option value="1">Mobile</option>
<option value="2">Email</option>
</select>
然后尝试这个
$(function() {
$('#theme').change(function() {
$('.box').hide();
$('#number' + $(this).val()).show();
})
});
答案 1 :(得分:0)
第一:您需要隐藏div[id^=number]
所有number
div ids,并使用option:selected
index()
显示该部分..下一个代码应该与您合作< / p>
$(function() {
$('#theme').change(function() {
$('div[id^=number]').hide();
var GetSectionNum = $(this).find('option:selected').index() == 0 ? 1 : $(this).find('option:selected').index(); // if the selected option is 0 mean 'select' change it to the next of it directly .. so in this code if you try to select 'select' it will select mobile
$(this).find('option:eq('+GetSectionNum+')').prop('selected' , true);
$('#number' + GetSectionNum).show();
}).change();
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<select id="theme">
<option>Select</option>
<option>Mobile</option>
<option>Email</option>
</select>
<div id="number1" class="box">
<label for="sms">SMS text</label>
<textarea rows="15" cols="80"></textarea>
</div>
<div id="number2" class="box">
<label for="mail">Mail :/label>
<label for="subject">Subject</label>
<textarea rows="2" cols="80"></textarea>
<label for="email" style="font-size: 20px;">Body</label>
<textarea rows="15" cols="80"></textarea>
</div>
答案 2 :(得分:0)
你应该把价值放在像这样的选项上
echo "<option value="'.$row[ "value" ].'">" . $row[ "value" ] . "</option>";
希望它有所帮助。