我有一个表单,如果用户从下拉列表中选择“已婚”,则会显示一些文本字段,询问其配偶的信息。在Firefox和IE中一切正常,但Safari给我带来了麻烦。
这是HTML:
<ul>
<li>
<label for="maritalStatus">Marital Status</label><br/>
<select name="maritalStatus" id="maritalStatus" tabindex="80">
<option name="Single" id="Single" value="Single" selected="selected" onClick="imSingle()">Single</option>
<option id="Married" name="Married" value="Married" onClick="imMarried()">Married</option>
</select>
</li>
<li id="spouseFullName">
<label for="spouseFullName">Spouse Full Name</label><br/>
<input type="text" name="Spouse Full Name" id="spouseFullNameField" onchange="spouseName()" tabindex="90"/>
</li>
<li id="spouseDOB">
<label for="spouseDOB">Spouse Date of Birth</label><br/>
<input type="text" name="Spouse DOB" id="spouseDOB" tabindex="100" />
</li>
<li id="spouseOccupation">
<label for="spouseOccupation">Spouse Occupation</label><br/>
<input type="text" name="Spouse Occupation" id="spouseOccupation" tabindex="101" />
</li>
</ul>
这是javascript:
document.getElementById("spouseFullName").style.display = "none";
document.getElementById("spouseDOB").style.display = "none";
document.getElementById("spouseOccupation").style.display = "none";
function imMarried() {
if (document.getElementById('Married').selected){
document.getElementById("spouseFullName").style.display = "block";
document.getElementById("spouseDOB").style.display = "block";
document.getElementById("spouseOccupation").style.display = "block";
}
}
我确实启用了javascript。
答案 0 :(得分:0)
必须是
function imMarried() {
var maritalStat = document.getElementById('maritalStatus');
if (maritalStat.options[maritalStat.selectedIndex] && maritalStat.options[maritalStat.selectedIndex].value=="Married") {
document.getElementById("spouseFullName").style.display = "block";
document.getElementById("spouseDOB").style.display = "block";
document.getElementById("spouseOccupation").style.display = "block";
}
}
并添加onchange触发器以从选项中选择和删除onclick,即:
<select name="maritalStatus" id="maritalStatus" tabindex="80" onchange="imMarried()">
...
<option id="Married" name="Married" value="Married">Married</option>