Javascript 动态OnClick-in IE、Safari、Firefox
我有以下代码。我正在尝试根据第一个下拉列表中的选择动态地将下拉选项添加到第二个下拉列表中。两者都是通过Ajax调用从数据库中提取数据的脚本生成的。这是相关代码Javascript 动态OnClick-in IE、Safari、Firefox,javascript,cross-browser,Javascript,Cross Browser,我有以下代码。我正在尝试根据第一个下拉列表中的选择动态地将下拉选项添加到第二个下拉列表中。两者都是通过Ajax调用从数据库中提取数据的脚本生成的。这是相关代码 function setSub(doc) { // Setup some variables var sNode = document.getElementById('4'); // GRAB THE ELEMENT HERE var rmiData = doc.getElementById('rmiData').inner
function setSub(doc) {
// Setup some variables
var sNode = document.getElementById('4'); // GRAB THE ELEMENT HERE
var rmiData = doc.getElementById('rmiData').innerHTML;
var aItems = rmiData.split("|");
var aVals;
// Set some background
sNode.style.background = "#fff";
// Loop through adding options to the drop down
for (var x = 0; x < (aItems.length -1); x ++) {
aVals = aItems[x].split("=");
// ADD OPTIONS DYNAMICALLY TO SECOND DROP-DOWN HERE
sNode.options[x+1] = new Option(aVals[1],aVals[0],false,false);
// PROBLEM HERE: ADD ONCLICK TO THE OPTION WE JUST CREATED
sNode.options[x+1].onclick = function() { fixDayList(); };
//sNode.options[x+1].onclick = new Function("fixDayList();");
//sNode.options[x+1].setAttribute("onclick", "fixDayList();");
// END PROBLEM LINES
}
// Set the length
sNode.length = x+1;
// Select the first item in the list
sNode[0].selected = true;
}
如果您注意到//PROBLEM HERE行后面的部分,我尝试用三种不同的方式添加onclick事件。所有3个都能在Firefox中正常工作。这3个在IE6或Safari中都不起作用,但在IE8中不确定。有什么建议吗?代码的其余部分使用的是一些老式的JavaScript,我从一段现有的遗留代码中复制了它,我只是尝试将onclick添加到我的版本中,最好不用重新编写很多代码
有没有想过为什么onclick活动不会在Safari和IE中启动
我确实可以在代码中访问jQuery。因此,如果jQuery在内部解决了这个问题,并且我可以找到合适的选择器来使用,那么这就行了。但是,我不知道如何选择这个,确切地说。我试过:
$'4'。选项[x+1]。单击函数{fixDayList;}
但是这个选择器不好,我不确定如何选择正确的选择器。我用jQuery的方式是绿色的。使用如下方式:
if(window.addEventListener){
sNode.options[x+1].addEventListener('click', fixDayList, false);
} else if (window.attachEvent){
sNode.options[x+1].attachEvent('onclick', fixDayList);
} else {
sNode.options[x+1].onclick = fixDayList;
}
更新:
在Safari中,除非选项元素可见且不显示为下拉列表,否则它们永远不会触发单击事件。但是,如果在select元素中添加size=10或其他值,Safari将触发option元素上的单击事件
您最好的选择是侦听select元素上的更改事件,而不是尝试使用单击选项。这也适用于Firefox,因此现在我有4种不同的解决方案适用于Firefox,但在IE或Safari中不起作用。@Joel,Safari不会在显示为下拉列表的选项元素上触发单击事件。我对IE不太确定,但我认为是一样的。很抱歉我的回答中出现了混乱,但我刚刚测试过,至少在Safari中是这样工作的。我更新了我的答案。你说的对。我做得不对。我需要对其进行编码,以便它在更改下拉列表时触发,而不是单击选项时触发。