Javascript在IE8中不起作用
以下Javascript在IE8中不起作用,但在FF、Safari、IE9和Chrome中效果良好。我承认自己是Javascript的不速之客,我花了2天时间寻找一个解决方案,但运气不佳。IE8不喜欢切换功能或隐藏Javascript在IE8中不起作用,javascript,internet-explorer-8,toggle,Javascript,Internet Explorer 8,Toggle,以下Javascript在IE8中不起作用,但在FF、Safari、IE9和Chrome中效果良好。我承认自己是Javascript的不速之客,我花了2天时间寻找一个解决方案,但运气不佳。IE8不喜欢切换功能或隐藏 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html x
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">
.hide {
display: none;
}
</style>
<script type="text/javascript">
function toggleField(evt) {
evt = (evt) ? evt : event;
var target = (evt.target) ? evt.target : evt.srcElement;
var block = document.getElementById("specialty");
if (target.id == "fieldFlag1") {
block.style.display = "block";
} else {
block.style.display = "none";
}
}
</script>
</head>
<body>
<div id="profession">
Field of professional work (as applicable):
<select size="1" name="profession">
<option>-- Choose One --</option>
<option value="Architecture">Architecture</option>
<option value="FineArts">Arts, Fine</option>
<option value="PerformingArts">Arts, Performing</option>
<option value="Business">Business</option>
<option value="Consulting">Consulting</option>
<option value="Counseling">Counseling</option>
<option value="Dentistry">Dentistry</option>
<option value="Education">Education</option>
<option value="Engineering">Engineering</option>
<option value="Environment">Environment</option>
<option value="Finance">Finance</option>
<option value="Government">Government</option>
<option value="Healthcare—NonMedical">Healthcare—Non Medical</option>
<option value="HigherEducation">Higher Education</option>
<option value="InformationTechnology">Information Technology</option>
<option value="Law">Law</option>
<option value="Marketing">Marketing</option>
<option value="Media/Communications">Media/Communications</option>
<option value="Medicine">Medicine</option>
<option value="Military">Military</option>
<option value="Music">Music</option>
<option value="NonProfit">Non Profit</option>
<option value="Nursing" id="fieldFlag1" onclick="toggleField(event)">Nursing</option>
<option value="PublicService">Public Service</option>
<option value="Science/Research">Science/Research</option>
<option value="SocialServices">Social Services</option>
<option value="Sports">Sports</option>
<option value="Trade/Craft">Trade/Craft</option>
</select>
</div>
<div id="specialty" class="hide">
Choose Specialty:
<select name="Specialty" size="1">
<option value="nursing">Nursing</option>
<option value="nurse Practitioner Unspecified">Nurse·Practitioner·Unspecified</option>
<option value="nurse inactive">Nurse·Inactive</option>
<option value="womens health">Womens·Health</option>
<option value="administration">Administration</option>
<option value="hospital">Hospital</option>
<option value="critical care">Critical·Care</option>
<option value="home health">Home·Health</option>
<option value="surgical">Surgical</option>
<option value="clinical Research">Clinical·Research</option>
<option value="family health">Family·Health</option>
<option value="acute care nursing">Acute·Care·Nursing</option>
<option value="community Health Nursing">Community·Health·Nursing</option>
<option value="emergency nursing">Emergency·Nursing</option>
<option value="nurse practitioner: adult health">Nurse·Practitioner:·Adult·Health</option>
<option value="nurse practitioner: pediatrics">Nurse·Practitioner:·Pediatrics</option>
<option value="nurse practitioner: neonatal">Nurse·Practitioner:·Neonatal</option>
<option value="nurse practitioner: acute care">Nurse·Practitioner:·Acute·Care</option>
<option value="nurse practitioner: family">Nurse·Practitioner:·Family</option>
<option value="nurse practitioner: gerontology">Nurse·Practitioner:·Gerontology</option>
<option value="nurse practitioner: women's health">Nurse·Practitioner:·Women's·Health</option>
</select>
</div>
</body>
</html>
无标题文件
.隐藏{
显示:无;
}
功能切换字段(evt){
evt=(evt)?evt:事件;
var target=(evt.target)?evt.target:evt.src元素;
var block=document.getElementById(“专业”);
如果(target.id==“fieldFlag1”){
block.style.display=“block”;
}否则{
block.style.display=“无”;
}
}
专业工作领域(如适用):
--选一个--
建筑学
美术
艺术、表演
生意
咨询
咨询
牙科
教育类
工程类
环境
财务
政府
医疗保健—;非 ;医学的
更高 ;教育类
信息 ;技术
法律
营销
媒体/通讯
药
军事的
音乐
非 ;利润
护理部
公众 ;服务
科学/研究
社会 ;服务
体育
行业/工艺
选择专业:
护理部
看护·专业人员·未指明
看护·不活跃的
女性·健康
管理
医院
批评的·照顾
家·健康
外科的
临床的·研究
家庭·健康
严重的·照顾·护理部
社区·健康·护理部
紧急情况·护理部
看护·专业人员:·成人·健康
看护·专业人员:·儿科学
看护·专业人员:·新生儿
看护·专业人员:·严重的·照顾
看护·专业人员:·家庭
看护·专业人员:·老年学
看护·专业人员:·女性·健康
为了使您的代码在IE8中工作,您需要更改:
var target = (evt.target) ? evt.target : evt.srcElement;
与:
原因是9.0之前的Internet Explorer版本没有以标准方式处理事件
每当触发事件时,名为event
的全局变量在任何地方都可用。它被称为事件对象
您可以查看此URL以了解更多详细信息:
在HTML中(使用onchange
事件select
代替选项onclick
):
onclick
关于选项-我认为它根本不应该可用
UPD:是一个答案,您可以在其中找到一个浏览器列表,该列表不支持在第一次选择更改时对
执行onclick事件
var e = document.getElementById("your First Select");
var valueOption= e.options[e.selectedIndex].value;
var block = document.getElementById("specialty");
if (valueOption == "Nursing")
block.style.display = "block";
} else {
block.style.display = "none";
}
你说的“行不通”是什么意思?我猜你的意思是块
没有显示或隐藏,但我可能错了。请为您的问题提供更多详细信息。我认为点击事件对选项无效。但是,它在选定元素上有效。很抱歉,是的,显示隐藏选中注释,我将很快添加更多详细信息=)
function toggleField(target) {
var block = document.getElementById("specialty");
if (target.options[target.selectedIndex].value == "Nursing") {
block.style.display = "block";
} else {
block.style.display = "none";
}
}
<select size="1" name="profession" onchange="toggleField(this)">
evt = (evt) ? evt : event;
var target = (evt.target) ? evt.target : evt.srcElement;
var e = document.getElementById("your First Select");
var valueOption= e.options[e.selectedIndex].value;
var block = document.getElementById("specialty");
if (valueOption == "Nursing")
block.style.display = "block";
} else {
block.style.display = "none";
}