最初指出了这一点并 solved今天早上,但后来我必须将 name="region_option"
添加到 select 元素,以便它将值输出到 SQL 查询中。数据库/查询的东西都很好,但是我无法让显示/隐藏再次与这些区域正常工作。我一直坚持让它与具有 name="region_option"
的 select
一起使用。
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<div class="bodytype">
<h2>Bodytype</h2>
<input class="bodytype--owls" name="bodytype_option" type="radio" value="owls">Owls</input>
<input class="bodytype--others" name="bodytype_option" type="radio" value="others">Others</input>
</div>
<div class="country">
<h2>Pick country</h2>
<select name="country_option">
<option value="not-selected">Select the country</option>
<option value="England">England</option>
<option value="Scotland">Scotland</option>
<option value="Ireland">Ireland</option>
<option value="Wales">Wales</option>
</select>
</div>
<div class="not-selected">
<h2>Notice!</h2>
<p>Please select a country to be able to pick the region.</p>
</div>
<div class="regions" id="England">
<h3>Pick region in England</h3>
<select name="region_option">
<option value="North">North</option>
<option value="South">South</option>
<option value="East">East</option>
<option value="West">West</option>
<option value="Midlands">Midlands</option>
</select>
</div>
<div class="regions" id="Scotland">
<h3>Pick region in Scotland</h3>
<select name="region_option">
<option value="North">North</option>
<option value="South">South</option>
</select>
</div>
<div class="regions" id="Ireland">
<h3>Pick region in Ireland</h3>
<select name="region_option">
<option value="Northern">Northern</option>
<option value="Republic">Republic</option>
</select>
</div>
<div class="regions" id="Wales">
<h3>Pick region in Wales</h3>
<select name="region_option">
<option value="North">North</option>
<option value="South">South</option>
</select>
</div>
<br /><br />
<button class="identify__button">Identify</button>
jQuery
$(document).ready(function(){
$('#England, #Scotland, #Ireland, #Wales').hide();
$('.country_option').change(function() {
$('.not-selected, #England, #Scotland, #Ireland, #Wales').hide();
$('#' + $(this).val()).show();
});
});
我很想知道我缺少什么来解决这个问题,以及为什么它一开始就不起作用。我冒昧地将其放在CodePen中为了方便起见。
提前致谢。
最佳答案
您有一个 class=country_option
选择器,而它实际上是 name=country_option
。
尝试
$('[name="country_option"]').change(function() {
JSFiddle:http://jsfiddle.net/mvt0982x/
或者更好(更明显):
$('select[name="country_option"]').change(function() {
关于javascript - 显示/隐藏切换不适用于数据库输出的选择名称,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/25996868/