2016-09-06 2 views
-5

что не так с этим кодом? Почему мое событие onchange не работает? Я уже много пробовал, и это меня раздражает. Пожалуйста помоги?Javascript 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> 

Любой, пожалуйста, указать мне, где точная проблема ... Позвольте мне попробовать запустить его соответствующим образом

+3

'innerHtml' не то же самое, как' innerHTML' – Li357

+0

, и вы должны быть настройки текста, а не HTML опциона. И вы действительно не должны использовать цикл for for для массива. – epascarello

+0

В вашем коде есть синтаксические ошибки. Браузер сообщает вам, что это за ошибки. Посмотрите на консоль JavaScript. – David

ответ

0

Два изменения. Изменение 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

+0

попробовал ... все еще это aint working..but спасибо в любом случае ... я собираюсь использовать метод базы данных ... Я понял, что мой список будет довольно большим –

0

Попробуйте следующие:

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

ЯШ:

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/

+0

спасибо ... все еще есть что-то не так, я не знаю .. это не работает ... во всяком случае спасибо 4, принимая время ... собираюсь использовать базу данных и метод AJAX ... мои списки опций будут довольно большими, я понял –