【问题标题】:Javascript onchange event not working in my codeJavascript onchange 事件在我的代码中不起作用
【发布时间】:2016-09-06 11:51:35
【问题描述】:

这段代码有什么问题?为什么我的 onchange 事件不起作用?我已经尝试了很多,这让我发疯了。请帮忙?

<!DOCTYPE html>
<html>
<head>
<script type=text/javascript>
function populate(s1,s2){
var s1 = document.getElementById(s1);
var s2 = document.getElementById(s2);
s2.innerHTML = "";
if(s1.value == "Chevy"){
var optionArray ["|", "camaro|Camaro", "corvette|Corvette",
"impala|Impala"];
}
else if(s1.value=="Dodge"){
var optionArray=["|", "avanger|Avanger", "challenger|Challenger",
"charger|Charger"];
}
else if(s1.value=="Ford"){
var optionArray=["|", "mustang|Mustang", "shelby|Shelby"];
}
for(var option in optionArray){
var pair=optionArray[option].split("|");
var newOption=document.createElement("option");
newOption.value=pair[0]; 
newOption.innerHtml=pair[1];
s2.options.add(newOption);
}
}
</script>
</head>
<body>
<h2>Choose Your Car</h2>
<hr />
Choose Car Make:
<select id="slct1" name="slct1" onchange="populate(this.id, 'slct2')">
<option value="">Select</option>
<option value="Chevy">Chevy</option>
<option value="Dodge">Dodge</option>
<option value="Ford">Ford</option>
</select>
<hr />
Choose Car Model:
<select id="slct2" name="slct2"></select>
<hr />
</body>
</html>

任何人,请指出确切的问题在哪里......让我尝试相应地运行它

【问题讨论】:

  • innerHtmlinnerHTML 不同
  • 你应该设置文本,而不是选项的 html。而且你真的不应该对数组使用 for in 循环。
  • 您的代码有语法错误。浏览器会告诉您这些错误是什么。查看 JavaScript 控制台。
  • 听说过每个浏览器中都存在的 javascript 调试器吗?
  • var optionArray ["|", "camaro|Camaro", "corvette|Corvette", "impala|Impala"]; 需要有一个=

标签: javascript php jquery html onchange


【解决方案1】:

两个变化。将innerHtml 更改为innerHTML 并分配= 登录

if(s1.value == "Chevy"){
var optionArray ["|", "camaro|Camaro", "corvette|Corvette",
"impala|Impala"];
}

将以上内容改正为

if(s1.value == "Chevy"){
var optionArray = ["|", "camaro|Camaro", "corvette|Corvette",
"impala|Impala"];
}

JSFIDDLE

【讨论】:

  • 试过了……还是不行……不过还是谢谢……我要使用数据库方法……我发现我的清单会很大
【解决方案2】:

尝试以下方法:

<select id="slct1" name="slct1" onchange="populate(this, 'slct2')">

js:

populate = function(s1,s2) {
    var s2 = document.getElementById(s2);
    s2.innerHTML = "";
    if(s1.value == "Chevy"){
        var optionArray = ["|", "camaro|Camaro", "corvette|Corvette",
"impala|Impala"];
    }
    else if(s1.value=="Dodge"){
        var optionArray=["|", "avanger|Avanger", "challenger|Challenger",
"charger|Charger"];
    }
    else if(s1.value=="Ford"){
        var optionArray=["|", "mustang|Mustang", "shelby|Shelby"];
    }
    for(var option in optionArray){
        var pair=optionArray[option].split("|");
        var newOption=document.createElement("option");
        newOption.value=pair[0]; 
        newOption.innerHTML=pair[1];
        s2.options.add(newOption);
    }
}

演示: https://jsfiddle.net/xkyffr4h/1/

【讨论】:

  • 谢谢...仍然有问题我不知道..它无法正常工作...无论如何感谢 4 花时间...打算使用数据库和 AJAX 方法...我的选项列表是我想会很大
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
相关资源
最近更新 更多