我在JS文件中要注册1个window.onload事件,这样写:
页面:
<body onload="alert('1');">我在JS文件中写:window.onload = function(){alert("2");}。这样就只能弹出2,不能弹出1,我想弹出1后再弹出2。请问JS该怎么写。注:body的onload事件是不可预知的,不知道会写什么代码。谢谢。
页面:
<body onload="alert('1');">我在JS文件中写:window.onload = function(){alert("2");}。这样就只能弹出2,不能弹出1,我想弹出1后再弹出2。请问JS该怎么写。注:body的onload事件是不可预知的,不知道会写什么代码。谢谢。
<script>
window.onload=function(){alert1();alert2();}
function alert1(){alert("1");}
function alert2(){alert("2");}
</script>
window.onload=function(参数)
{
if参数1
alert1();
else
alert2();
}
function alert1(){alert("1");}
function alert2(){alert("2");}
</script>
这样可否
window.onload = function(){alert("1");alert("2")}。
每个脚本定义的全局变量和函数,都可以被后面执行的脚本所调用。
变量的调用,必须是前面已经声明,否则获取的变量值是undefined。
<script type="text/javscrpt">//<![CDATA[
alert(tmp); //输出 undefined
var tmp = 1;
alert(tmp); //输出 1
//]]></script>
同一段脚本,函数定义可以出现在函数调用的后面,但是如果是分别在两段代码,且函数调用在第一段代码中,则会报函数未定义错误。
<script type="text/javscrpt">//<![CDATA[
aa(); //浏览器报错
//]]></script>
<script type="text/javscrpt">//<![CDATA[
aa(); //输出 1
function aa(){alert(1);}
//]]></script>
document.write()会把输出写入到脚本文档所在的位置,浏览器解析完documemt.write()所在文档内容后,继续解析document.write()输出的内容,然后在继续解析HTML文档。 <script type="text/javascript">//<![CDATA[
document.write('<script type="text/javascript" src="test.js"><\\/script>');
document.write('<script type="text/javascript">');
document.write('alert(2);')
document.write('alert("我是" + tmpStr);');
document.write('<\\/script>');
//]]></script>
<script type="text/javascript">//<![CDATA[
alert(3);
//]]></script>
test.js的内容是:var tmpStr = 1;
alert(tmpStr);在Firefox和Opera中的弹出值的顺序是:1、2、我是1、3
在IE中弹出值的顺序是:2、1、3,同时浏览器报错:tmpStr未定义
原因可能是IE在document.write时,并未等待加载SRC中的Javascript代码完毕后,才执行下一行,所以导致2先弹出,并且执行到document.write(’document.write("我是" + tmpStr)’)调用tmpStr时,tmpStr并未定义,从而报错。解决这个问题,可以利用HTML解析是解析完一个HTML标签,再执行下一个的原理,把代码拆分来实现:<script type="text/javascript">//<![CDATA[
document.write('<script type="text/javascript" src="test.js"><\\/script>');
//]]></script>
<script type="text/javascript">//<![CDATA[
document.write('<script type="text/javascript">');
document.write('alert(2);')
document.write('alert("我是" + tmpStr);');
document.write('<\\/script>');
//]]></script>
<script type="text/javascript">//<![CDATA[
alert(3);
//]]></script>
这样IE下和其他浏览器输出值的顺序都是一直的了:1、2、我是1、3。
如何改变Javascript在页面的执行顺序利用onload
<script type="text/javascript">//<![CDATA[
window.onload = f;
function f(){alert(1);}
alert(2);
//]]></script>
输出值顺序是 2、1。需要注意的是,如果存在多个winodws.onload的话,只有最有一个生效,解决这个办法是:window.onload = function(){f();f1();f2();.....}
利用2级DOM事件类型if(document.addEventListener){
window.addEventListener('load',f,false);
window.addEventListener('load',f1,false);
...
}else{
window.attachEvent('onload',f);
window.attachEvent('onload',f1);
...
}IE中可以利用defer,defer作用是把代码加载下来,并不立即执行,等文档装载完毕之后再执行,有点类似window.onload,但是没有window.onload那样的局限性,可以重复使用,但是只在IE中有效,所以上面的例子可以修改成为
<script type="text/javascript">//<![CDATA[
document.write('<script type="text/javascript" src="test.js"><\\/script>');
document.write('<script type="text/javascript" defer="defer">');
document.write('alert(2);')
document.write('alert("我是" + tmpStr);');
document.write('<\\/script>');
//]]></script>
<script type="text/javascript">//<![CDATA[
alert(3);
//]]></script>
这样IE就不报错了,输出值的顺序变成:1、3、2、我是1当HTML解析器遇到一个脚本,它必须按常规终止对文档的解析并等待脚本执行。为了解决这个问题HTML4标准定义了defer。通过defer来提示浏览器可以继续解析HTML文档,并延迟执行脚本。这种延迟在脚本从外部文件载入时非常有用,让浏览器不必等待外部文件全部载入之后才继续执行,能有效的提高性能。IE是目前唯一支持defer属性的浏览器,但IE并没有正确的实现了defer属性,因为延迟的脚本总是被延迟,直到文档结束,而不是只延迟到下一个非延迟的脚本。这意味着,IE中延迟的脚本的执行顺序相当混乱,并且不能定义任何后面非延迟脚本并须的函数和变量。在IE中所有的defer的脚本执行时间应该都是HTML文档树建立以后,window.onload之前。利用Ajax。
因为xmlhttpRequest能判断外部文档加载的状态,所以能够改变代码的加载顺序。
在其body onlod中加载 然而js window.onload
在body onload中就不会被执行,如果存在多个onload只会执行后者
楼主在写公用js的同时 页面中所有onload都无法执行/
<script>
//同事写的
window.onload = f;
var f = function(){
alert('2');
}
</script>结果是2
<body onload="alert('1')">
<script>
new document.body.onload
window.onload = function(){alert("2");}
</script>
看看是不是理解正确楼主是要写一个通用的js
然后引用
同时还要求<body onload="alert('1');"> 执行我说的对不?
页面:
<body onload="alert('1');">我在JS文件中写:window.onload = function(){alert("2");}。这样就只能弹出2,不能弹出1,我想弹出1后再弹出2。请问JS该怎么写。注:body的onload事件是不可预知的,不知道会写什么代码。谢谢。 要知道不存在循环的情况下,代码是一行一行的处理的!!!
你可以这样写
<body onload="alert('1')">
然后调用js文件!!
请问下,new document.body.onload 表示什么意思。
其它的事件可否这样使用,比如button的onclick能不能这样用。
你这样只会执行最后一个window.onload
//1.IEContentLoaded(window,f);
//2.body onload
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>无标题页</title>
<script language="javascript">
var f = function(){
alert('a')
}
var f1 = function(){
alert('a1')
}
IEContentLoaded(window,f);//load调用
function IEContentLoaded (w, fn) {
var d = w.document, done = false,
init = function () {
if (!done) {
done = true;
fn();
}
};
(function () {
try {
d.documentElement.doScroll('left');
} catch (e) {
setTimeout(arguments.callee, 50);
return;
}
init();
})();
d.onreadystatechange = function() {
if (d.readyState == 'complete') {
d.onreadystatechange = null;
init();
}
};
} </script>
</head>
<body onload="f1()">
</body>
</html>
先执行JS,后执行CS
safari输出是a1,a我只装了这3种浏览器
剩下的自己在弄弄就行了<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>无标题页</title>
<script language="javascript">
var f = function(){
alert('a')
}
var f1 = function(){
alert('a1')
}
bindReady(f);
function bindReady(isFtn){
if(navigator.userAgent.indexOf("MSIE")>0) {//IE
IEContentLoaded(window,isFtn);//IE load调用
}
if(isFirefox=navigator.userAgent.indexOf("Firefox")>0){ //"Firefox";
document.addEventListener("DOMContentLoaded", isFtn, false);
}
if(isSafari=navigator.userAgent.indexOf("Safari")>0) { //"Safari";
if ( document.readyState != "loaded" && document.readyState != "complete" ) {
setTimeout( isFtn, 0 );
return;
}
}
if(isCamino=navigator.userAgent.indexOf("Camino")>0){
//"Camino";
}
if(isMozilla=navigator.userAgent.indexOf("Gecko/")>0){
//"Gecko";
}
}
function IEContentLoaded (w, fn) {
var d = w.document, done = false,
init = function () {
if (!done) {
done = true;
fn();
}
};
(function () {
try {
d.documentElement.doScroll('left');
} catch (e) {
setTimeout(arguments.callee, 50);
return;
}
init();
})();
d.onreadystatechange = function() {
if (d.readyState == 'complete') {
d.onreadystatechange = null;
init();
}
};
} </script>
</head>
<body onload="f1()">
</body>
</html>
在JS中使用onload 跟body中使用onload始终是会起冲突的
只能执行一个onload
http://www.pconline.com.cn/pcedu/empolder/wz/javascript/10301/126194.html
如果不是onload,而是一般按钮的onmousedown事件会冲突吗?
for (var i = 0; i < document.styleSheets.length; i++)
if (document.styleSheets[i].disabled) {
setTimeout( isFtn, 0 );
return;
}
}, false);
window.attachEvent("onload",alert2)
function alert1(){
alert("1")
}
function alert2(){
alert("2")
}
看看jquery的源代码就会明白了.很经典的JS库
你想如何绑定?
直接在HTML?或者说创建dom
楼主这样谢不是重复了吗?直接可以写称
window.onload=function(){alert('1');alert('2');}
最简便的方法
直接在html中绑定onclick等事件~
如
<a href='#' onclick='aa();'>bindonClick</a>
这样如果我JS文件中重写了连接的onclick,就一样覆盖率以前的aa()函数。我的意思说跟我贴说的情况是一样的,重新给onclick赋值,而不覆盖以前的onclick事件。除你贴出的很复杂的要判断浏览器的方法外,还有没有其他简单的方法。
<title>无标题页</title>
<script language="javascript" type="text/javascript" src="JScript/JScript.js"></script>
</head>
<body onload="window.alert('1');pop(2);">
function pop(a)
{
alert(a);
}
重写checkbox
效果图:
jQuery.fn.extend({
checkbox: function(opt) {
$(this).hide().each(function(){
$('<img>')
.attr({src: this.checked ? opt.checked : opt.unchecked, name: this.name})
.click(function(){
var check = $(this).next()[0].checked == true;
$(this)
.attr({src: check ? opt.unchecked : opt.checked})
.next()[0].checked = !check;
})
.insertBefore(this);
});
},
toggleCheckbox: function(o, opt) {
o = o || 'on';
return this.each(function() {
switch(o) {
case 'on':
$('img[@name='+this.name+']').attr({src: opt.checked});
this.checked = true;
break;
case 'off':
$('img[@name='+this.name+']').attr({src: opt.unchecked});
this.checked = false;
break;
case 'toggle':
$('img[@name='+this.name+']').attr({src: this.checked ? opt.unchecked : opt.checked});
this.checked = !this.checked;
break;
}
});
}
}); $(document).ready(function() {//这里就是之前你所提到的onload问题,他这里就是我帖出来的那种方法.也是根据浏览器采用不同方式进行加载的,这样即便复杂,但是复杂仅仅在新手面前而言,其实一点都不复杂,仔细看看就知道了,考虑方面全面.应付不同的环境.往往在新手开发JS的时候不会考虑浏览器的.
// 单选
$('input[@type=checkbox]').checkbox({//checkbox就是上面插件所封装的函数
checked: 'images/bkg_checkbox_checked.jpg', //给选定参数赋值
unchecked: 'images/bkg_checkbox.jpg' //给未选定参数赋值
});
/*$('input[@type=checkbox]')
这里呢? $号相当于函数,获取对象,当然jquery不仅仅获取单个object
function $(obj){
return document.getElementById(obj);
}
'input[@type=checkbox]' 是查找HTML元素中所有type=checkbox的所有input元素*/
// 全选
$('input[@name=btn1]').click(function() {//jquery封装后直接给对象创建onclick事件这里就不会与js onclick起到冲突
$('input[@type=checkbox]').toggleCheckbox('on',{
checked: 'images/bkg_checkbox_checked.jpg',
unchecked: 'images/bkg_checkbox.jpg'
});
});
// 全不选
$('input[@name=btn2]').click(function() {
$('input[@type=checkbox]').toggleCheckbox('off',{
checked: 'images/bkg_checkbox_checked.jpg',
unchecked: 'images/bkg_checkbox.jpg'
});
});
// 反选
$('input[@name=btn3]').click(function() {
$('input[@type=checkbox]').toggleCheckbox('toggle',{
checked: 'images/bkg_checkbox_checked.jpg',
unchecked: 'images/bkg_checkbox.jpg'
});
});
// 查看选择状态
$('input[@name=btn]').click(function() {
var sumCheck = $('input[@type=checkbox][@checked]');
if (sumCheck.size() == 0)
alert('你一个也没选');
else{
var s = '';
sumCheck.each(function() {
s += $(this).attr("name") + ',';
});
alert('你选择了'+s);
}
});
});