Closed. This question needs to be more focused。它当前不接受答案。
想改善这个问题吗?更新问题,使其仅通过editing this post专注于一个问题。
3年前关闭。
根据下拉菜单中选择的值,我有四种类型的表单可显示在同一页面上。如果
条件1:如果选择了“后轮胎和2WD”,我想显示表格名称=“ RA”
条件1:如果选择了“后轮胎和MFWD”,我想显示表格名称=“ RB”
条件1:如果选择了前轮胎和MFWD,我想显示表格名称=“ FA”
条件1:如果选择“前轮胎和2WD”,我想显示表格名称=“ FB”
我通过创建多个页面来使其工作,但是这会使页面加载缓慢且不友好,而是我想基于同一页面上的选定值进行加载
在几分钟内给出说明。
想改善这个问题吗?更新问题,使其仅通过editing this post专注于一个问题。
3年前关闭。
根据下拉菜单中选择的值,我有四种类型的表单可显示在同一页面上。如果
条件1:如果选择了“后轮胎和2WD”,我想显示表格名称=“ RA”
条件1:如果选择了“后轮胎和MFWD”,我想显示表格名称=“ RB”
条件1:如果选择了前轮胎和MFWD,我想显示表格名称=“ FA”
条件1:如果选择“前轮胎和2WD”,我想显示表格名称=“ FB”
我通过创建多个页面来使其工作,但是这会使页面加载缓慢且不友好,而是我想基于同一页面上的选定值进行加载
最佳答案
<select class="FrontRearTire">
<option value="">Select Tire</option>
<option value="RearTire">Rear Tyre</option>
<option value="FrontTire">Front Tire</option>
</select>
<select class="TractorType">
<option value="">Select Tractor</option>
<option value="2WD">2WD</option>
<option value="MFWD">MFWD</option>
</select>
<div class="RearTire2WD" style="display:none;">
<form>RearTire2WD</form>
</div>
<div class="RearTireMFWD" style="display:none;">
<form>RearTireMFWD</form>
</div>
<div class="FrontTire2WD" style="display:none;">
<form>FrontTire2WD</form>
</div>
<div class="FrontTireMFWD" style="display:none;">
<form>FrontTireMFWD</form>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script>
$('.FrontRearTire').change(function(){
var frontRearTire= $('.FrontRearTire').val();
var tractorType= $('.TractorType').val();
show(frontRearTire,tractorType);
});
$('.TractorType').change(function(){
var frontRearTire= $('.FrontRearTire').val();
var tractorType= $('.TractorType').val();
show(frontRearTire,tractorType);
});
function show(frontRearTire,tractorType){
var showDiv = "."+frontRearTire+tractorType;
$(showDiv).show().siblings("div").hide();
}
</script>
在几分钟内给出说明。