我有一个带有隐藏下拉框的页面,当通过JavaScript inner.HTML =
命令选中一个复选框时,该页面就会出现。据我所知,我将无法从document.onload
函数中填充此数据,但我却得到了<div>
,当我执行此操作时,我将其设置为style="display:none"
。下拉框中输入要填充的选项,但是在尝试执行此操作时出现错误消息'Unable to set property 'innerHTML' of undefined or null reference'
。 <select>
标签不能赋予ID或innerHTML
值吗?
下面的代码:
var systemOptions = [];
var system = document.getElementById("systemstemp");
document.onload = getSystems();
function getSystems() {
$.ajax({
url: ".../_api/web/lists/getbytitle('Application List')/items?$select=Title",
type: "GET",
headers: {"accept": "application/json;odata=verbose"},
success: function (data) {
systemOptions = data.d.results;
for (var obj in systemOptions) {
system.innerHTML = "<option value='" + systemOptions[obj].Title + "'>" + systemOptions[obj].Title + "</option>";
}
}
});
}
<p><select id="systemstemp"></select></p>
systemOptions = [
{Title: "Call Platform"},
{Title: "CRM"},
{Title: "Email"},
{Title: "Monitoring"},
]
问题是,当您这样做时:
document.onload = getSystems();
您实际上是在立即调用getSystems
函数,而不是在触发document.onload
时调用。为了在getSystems
触发时运行onload
,请设置不带括号的功能:
document.onload = getSystems;
或直接将功能分配给document.onload
:
document.onload = function() {
$.ajax({...});
}
编辑
您还应该使用DOM API来创建选择选项,如本问答中所述:
如@Christos Lytras所述,您不应在getSystems
中使用括号。
添加:同时更新您的for循环:
/* other code */
for (var obj in systemOptions) {
system.innerHTML += "<option value='" + obj.Title + "'>" + obj.Title + "</option>";
}
/* other code */