我想在单击下拉列表的特定选项时显示表单,并在单击下拉列表的特定选项时隐藏表单
这是我的 html 代码:
<div class="form-group" id="venue-select">
<select class="form-control venue-dropdown" id="" onchange="myFunction()">
<option value="none" id="#hide" ><b>Select Venue Type</b></option>
<option>Theme Restaurant</option>
<option>Blah restaurant</option>
<option>Flana Restaurant</option>
<option>Woops Restaurant</option>
</select>
</div>
<div class="row bgcolor show-form" style="display:none;">
<div class="col-lg-6 col-md-6 col-xs-12 col-sm-12">
<form>
<div class="form-group">
<label><strong>Venue Name</strong><sup class = "venue-imp">*</sup></label>
<input type="text" class="form-control input-lg" placeholder="Jhanqar Banquet Hall">
</div>
</form>
</div>
<div class="col-lg-6 col-md-6 col-xs-12 col-sm-12">
<form>
<div class="form-group">
<label><strong>Venue Price</strong><sup class = "venue-imp">*</sup></label>
<input type="text" class="form-control input-lg" placeholder="Jhanqar Banquet Hall">
</div>
</form>
</div>
</div>
当我单击下拉列表中的任何 field 时,它工作正常,但我希望当我单击选择任何 field 时隐藏表单
这是我的 JavaScript 代码:
/*show fom*/
function myFunction() {
$('.show-form').show();
// $('.show-form').hide();
}
最佳答案
Try to this
<select class="form-control venue-dropdown" id="" onchange="myFunction(this.value)">
<option value="Theme Restaurant 1">Theme Restaurant 1</option>
<option value="Theme Restaurant 2">Theme Restaurant 2</option>
</select>
<script>
function myFunction(select_value) {
if(select_value == 'Theme Restaurant 1')
{
$('.show-form').show();
}
}
</script>
关于javascript - 单击下拉列表的特定选项时隐藏表单,单击下拉列表的特定选项时显示表单,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/48354788/