JavaScript onChange 未在 IE 中触发

JavaScript onChange not firing in IE

当下拉列表更改为特定值时,我试图让 javascript 到 运行,它在 Chrome 中一切正常,但 IE 只是拒绝启动"onChange" 函数。

这是我的下拉列表代码:

<select name="typeTenancy" onchange='TenancyCheck(this.value);' required>
  <option value=""></option>                                                
  <option value="1">1 - Option 1</option>   
  <option value="2">2 - Option 2</option>   
  <option value="3">3 - Option 3</option>
  <option value="4">4 - Option 4</option>
  <option value="5">5 - Option 5</option>                                                           
</select>

这是 Javascript 我希望在选择选项 4 时 运行:

function TenancyCheck(val){
    var element=document.getElementById('tenancyDuration');
    if(val=='4')
    blockReqTenancy();
    else  
    displayTenancy();
}

function blockReqTenancy() {
    document.getElementById("tenancyDuration").style="display:block";
    document.getElementById("tenancyDuration").required=true;
}

function displayTenancy() {
    document.getElementById("tenancyDuration").style="display:none";
    document.getElementById("tenancyDuration").required=false;
}

选择选项4时,它实际上揭示了一个输入字段,但是使用Internet Explorer 11时没有显示任何内容。

我也检查过并将脚本 src 放在我的 HTML 代码的正文中。

如果有人能解释为什么会发生这种情况并指出正确的方向来解决这个问题,我们将不胜感激。

当您说 getElementById 时,您没有名为 "tenancyDuration" 的 ID。您可以添加它。

对于 IE,请稍微更改您的功能。喜欢 style.display="block";并使用 setAttribute 函数

完整代码

<select name="typeTenancy" id ="tenancyDuration" onchange='TenancyCheck(this.value);' required>
 <option value=""></option>                                                
 <option value="1">1 - Option 1</option>   
 <option value="2">2 - Option 2</option>   
 <option value="3">3 - Option 3</option>
 <option value="4">4 - Option 4</option>
 <option value="5">5 - Option 5</option>                                                           
</select>

<script>
function TenancyCheck(val){
  var element=document.getElementById('tenancyDuration');
  if(val=='4')
   blockReqTenancy();
  else  
   displayTenancy();
}

function blockReqTenancy() {
document.getElementById("tenancyDuration").style.display="block";
document.getElementById("tenancyDuration").setAttribute("required", true); 
}

function displayTenancy() {
 document.getElementById("tenancyDuration").style.display="none";
 document.getElementById("tenancyDuration").setAttribute("required", false); 
}
</script>