功能是不是叫
我有一些JavaScript是应该的窗口加载后,但由于某种原因运行,它永远不会运行。功能是不是叫
这里是我的代码:
function setClasses(){
document.getElementsByClassName("gchoice_35_0")[0].onclick = sedanShow;
document.getElementsByClassName("gchoice_22_0")[0].onclick = sedanShow;
document.getElementsByClassName("gchoice_34_0")[0].onclick = sedanShow;
document.getElementsByClassName("gchoice_34_1")[0].onclick = suvShow;
document.getElementsByClassName("gchoice_35_1")[0].onclick = suvShow;
document.getElementsByClassName("gchoice_22_1")[0].onclick = suvShow;
document.getElementsByClassName("gchoice_22_2")[0].onclick = vanShow;
document.getElementsByClassName("gchoice_35_2")[0].onclick = vanShow;
document.getElementsByClassName("gchoice_34_2")[0].onclick = vanShow;
}
window.onload = setClasses;
的setClasses()函数似乎并没有运行。但是,当我通过FireBug的控制台手动调用它时,它确实有效。
代码放置在我的网页的标题。
任何帮助表示赞赏。
完整的HTML片段:
<head>
......
<script type="text/javascript">
function setClasses(){
document.getElementsByClassName("gchoice_35_0")[0].onclick = sedanShow;
document.getElementsByClassName("gchoice_22_0")[0].onclick = sedanShow;
document.getElementsByClassName("gchoice_34_0")[0].onclick = sedanShow;
document.getElementsByClassName("gchoice_34_1")[0].onclick = suvShow;
document.getElementsByClassName("gchoice_35_1")[0].onclick = suvShow;
document.getElementsByClassName("gchoice_22_1")[0].onclick = suvShow;
document.getElementsByClassName("gchoice_22_2")[0].onclick = vanShow;
document.getElementsByClassName("gchoice_35_2")[0].onclick = vanShow;
document.getElementsByClassName("gchoice_34_2")[0].onclick = vanShow;
}
function sedanShow(){
document.getElementById("sedan").style.display="inline"
document.getElementById("suv").style.display="none"
document.getElementById("van").style.display="none"
}
function suvShow(){
document.getElementById("sedan").style.display="none"
document.getElementById("suv").style.display="inline"
document.getElementById("van").style.display="none"
}
function vanShow(){
document.getElementById("sedan").style.display="none"
document.getElementById("suv").style.display="none"
document.getElementById("van").style.display="inline"
}
window.onload = setClasses;
</script>
......
你总是可以使用JQuery
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
setClasses();
});
</script>
编辑
例JQuery的事件重构:
$(".gchoice_35_0").click(function(){
//Handler Code...
});
尼斯,很好,JQuery也是一个非常好的解决方案,你可以通过在setClasses方法中显示Jquery事件处理来详细说明你的答案吗?我认为这会给你的答案增加一些价值。 – Zoidberg
一个很好的API参考:http://api.jquery.com/click/ –
我要给使用YUI,随意使用与否的答案,但我认为框架是一个好主意,以帮助加快JavaScript的发展。因此,添加以下到您的网页
<script type="text/javascript" src="http://yui.yahooapis.com/2.9.0/build/yahoo-dom-event/yahoo-dom-event.js"></script>
然后,而不是在window.onload = someFn的(因为这可以在IE,惊喜惊喜古怪的),请执行下列操作
YAHOO.util.Event.onDOMReady(function() {
setClasses();
});
然后在你的设置类的功能,请执行以下操作:
function setClasses(){
YAHOO.util.Event.on(document.getElementsByClassName("gchoice_35_0")[0], 'click', sedanShow);
YAHOO.util.Event.on(document.getElementsByClassName("gchoice_22_0")[0], 'click', sedanShow);
YAHOO.util.Event.on(document.getElementsByClassName("gchoice_34_0")[0], 'click', sedanShow);
YAHOO.util.Event.on(document.getElementsByClassName("gchoice_34_1")[0], 'click', suvShow);
YAHOO.util.Event.on(document.getElementsByClassName("gchoice_35_1")[0], 'click', suvShow);
YAHOO.util.Event.on(document.getElementsByClassName("gchoice_22_1")[0], 'click', suvShow);
YAHOO.util.Event.on(document.getElementsByClassName("gchoice_22_2")[0], 'click', vanShow);
YAHOO.util.Event.on(document.getElementsByClassName("gchoice_35_2")[0], 'click', vanShow);
YAHOO.util.Event.on(document.getElementsByClassName("gchoice_34_2")[0], 'click', vanShow);
}
这应该是个诀窍。
哪里您网页上显示这个代码?你介意发布一个不起作用的完整HTML代码片段吗? –
我相信setClasses正在运行,这不是问题。我敢打赌,如果你在你的setClasses函数中发出警报,它会触发。我相信这可能是你如何设置你的onclick属性。 IE要求它被设置为一个字符串,而Firefox则要求它是一个函数。 JQuery和YUI通过提供事件实用程序来帮助缓解这种情况。我会建议查看这些框架,因为它们有助于减少很多您必须处理的跨浏览器怪癖。 – Zoidberg
是什么其他设置window.onload重写此代码? – epascarello