У меня есть тестовая страница, основанная на проблеме, с которой я столкнулся:
<!DOCTYPE html>
<html>
<head>
<title>Test</title>
<style type="text/css">
#selectDiv { display: inline; }
</style>
<script type="text/javascript">
function changeOption(args) {
var sel = document.createElement("select");
var opt1 = document.createElement("option");
var opt2 = document.createElement("option");
var opt3 = document.createElement("option");
opt1.value = "opt1";
opt1.appendChild(document.createTextNode("Option 1"));
sel.appendChild(opt1);
opt2.value = "opt2";
opt2.appendChild(document.createTextNode("Option 2"));
sel.appendChild(opt2);
opt3.value = "opt3";
opt3.appendChild(document.createTextNode("Option 3"));
sel.appendChild(opt3);
// working on FireFox, not on Chrome
opt1.onclick = function() {changeOption()}
opt2.onclick = function() {changeOption()}
opt3.onclick = function() {changeOption()}
document.getElementById("selectDiv").appendChild(sel);
}
</script>
</head>
<body>
<h1>This is a test.</h1>
<div id="selectDiv">
<select id="test_select1" onchange="changeOption()">
<option value="opt1">Option 1</option>
<option value="opt2">Option 2</option>
<option value="opt3">Option 3</option>
</select>
</div>
</body>
</html>
В FireFox это работает так, как я и ожидал: каждый новый выбор создается с тремя вариантами; выбор одного создает новый выбор с тремя вариантами.
Но в Chrome он останавливается на втором выборе. То есть вновь созданный выбор, похоже, не получает функцию onclick. Первый выбор с радостью создает больше выборок, но это не то, что я ищу.
Safari ведет себя как Chrome, но этого и следовало ожидать, верно? Я пробовал версию jQuery, но она тоже не работает. Может кто-нибудь помочь мне здесь?
