[英]Dynamically add html select onClick of another select box option
I have one select box 我有一个选择框
<select id="combo_main" size="4" class="mutiple">
<option>Client Management</option>
<option>User Management</option>
<option>Store Management</option>
<option>Task Management</option>
</select></div>
on click of any of the options of the select box another select box has to be created with different options 单击选择框的任何选项时,必须使用不同的选项创建另一个选择框
this is the current code ive written 这是我写的当前代码
$("#combo_main").on(
{ "focus": function() {
//console.log('clicked!', this, this.value);
this.selectedIndex = -1;
}
, "change": function() {
choice = $(this).val();
//console.log('changed!', this, choice);
this.blur();
setTimeout(function() { alert('Chose '+ choice);
var newCB= document.createElement("select");
newCB.id = 'txtT';
var myOptions = {
"Value 1" : "Text 1",
"Value 2" : "Text 2",
"Value 3" : "Text 3"
}
$("#txtT").addOption(myOptions, false);
$("body").append(newCB);
}, 0);
}
});
I am getting the error 我收到错误
Uncaught TypeError: undefined is not a functionadd_user.html:50 (anonymous function) 未捕获的TypeError:未定义不是函数add_user.html:50(匿名函数)
at this line 在这条线
$("#txtT").addOption(myOptions, false);
You can use the following script, here is a JSFIDDLE . 您可以使用以下脚本,这是一个JSFIDDLE 。 I've changed the structure of the myOptions
a littlebit. 我稍微修改了myOptions
的结构。
$("#combo_main").on(
{"focus": function() {
this.selectedIndex = -1;
}
, "change": function() {
choice = $(this).val();
//console.log('changed!', this, choice);
this.blur();
setTimeout(function() {
alert('Chose ' + choice);
//var newCB = document.createElement("select");
//newCB.id = 'txtT';
var myOptions = [
{'val': "Value 1", 'text': "Text 1"},
{'val': "Value 2", 'text': "Text 2"},
{'val': "Value 3", 'text': "Text 3"}
];
var s = $('<select id="txtT" name="txtT" />');
$(myOptions).each(function(idx, obj) {
//console.log(idx);
//console.log(obj.text);
$("<option />", {value: obj.val, text: obj.text}).appendTo(s);
});
$("body").append(s);
}, 0);
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.