当前位置:文档之家› js事件

js事件

js事件
js事件

关于丢失键盘焦点的问题

var tf:TextField = new TextField();

tf.text = "请按任意键";

addChild(tf);

this.stage.addEventListener(KeyboardEvent.KEY_DOWN, keydownHandler);

function keydownHandler (evt:KeyboardEvent):void

{

tf.text = "按键码:" + evt.keyCode;

}

my_btn.addEventListener(MouseEvent.MOUSE_DOWN, clickHandler);

function clickHandler (evt:MouseEvent):void

{

removeChild(my_btn);

}

// my_btn为场景中一普通按钮[SampleButton]实例

运行效果是这样的:

一开始按键是没问题的,tf能正常显示键值

然后点一下按钮后,再按键,事件就不响应了

经过分析是这么一会事:

点击按钮时,焦点在按钮上,按钮消失了,舞台就失去焦点了

function clickHandler (evt:MouseEvent):void

{

removeChild(my_btn);

stage.focus = null; //在这里将焦点回归舞台}

这样设置下焦点就又可以继续响应按键了。

但是我想要问的是:如果都是这样的话,屏幕元件多了,岂不句句鼠标点击都要写这么一句么……

难道没有其它解决办法吗?

https://www.doczj.com/doc/bb4554066.html,/thread-18785-1-1.html

JS的event对象

Event属性和方法:

1. type:事件的类型,如onlick中的click;

2. srcElement/target:事件源,就是发生事件的元素;

3. button:声明被按下的鼠标键,整数,1代表左键,2代表右键,4代表中键,如果按下多个键,酒把这些值加起来,所以3就代表左右键同时按下;(firefox中0代表左键,1代表中间键,2代表右键)

4. clientX/clientY:事件发生的时候,鼠标相对于浏览器窗口可视文档区域的左上角的位置;(在DOM标准中,这两个属性值都不考虑文档的滚动情况,也就是说,无论文档滚动到哪里,只要事件发生在窗口左上角,clientX和clientY都是0,所以在IE中,要想得到事件发生的坐标相对于文档开头的位置,要加上

document.body.scrollLeft和document.body.scrollTop)

5. offsetX,offsetY/layerX,layerY:事件发生的时候,鼠标相对于源元素左上角的位置;

6. x,y/pageX,pageY:检索相对于父要素鼠标水平坐标的整数;

7. altKey,ctrlKey,shiftKey等:返回一个布尔值;

8. keyCode:返回keydown何keyup事件发生的时候按键的代码,以及keypress 事件的Unicode字符;(firefox2不支持event.keycode,可以用event.which替代)

9. fromElement,toElement:前者是指代mouseover事件中鼠标移动过的文档元素,后者指代mouseout事件中鼠标移动到的文档元素;

10. cancelBubble:一个布尔属性,把它设置为true的时候,将停止事件进一步起泡到包容层次的元素;(e.cancelBubble = true; 相当于e.stopPropagation();)

11. returnValue:一个布尔属性,设置为false的时候可以组织浏览器执行默认的事件动作;

(e.returnValue = false; 相当于e.preventDefault();)

12. attachEvent(),detachEvent()/addEventListener(),removeEventListener:为制定DOM对象事件类型注册多个事件处理函数的方法,它们有两个参数,第一个是事件类型,第二个是事件处理函数。在

attachEvent()事件执行的时候,this关键字指向的是window对象,而不是发生事件的那个元素;

13. screenX、screenY:鼠标指针相对于显示器左上角的位置,如果你想打开新的窗口,这两个属性很重要;

一些说明:

1. event代表事件的状态,例如触发event对象的元素、鼠标的位置及状态、按下的键等等;

2. event对象只在事件发生的过程中才有效。

firefox里的event跟IE里的不同,IE里的是全局变量,随时可用;firefox里的要用参数引导才能用,是运行时的临时变量。

在IE/Opera中是window.event,在Firefox中是event;而事件的对象,在IE中是window.event.srcElement,在Firefox中是event.target,Opera中两者都可用。

3. 下面两句效果相同

var evt = (evt) ? evt : ((window.event) ? window.event : null);

var evt = evt || window.event; // firefox下window.event为null, IE下event为null

4. IE中事件的起泡

IE中事件可以沿着包容层次一点点起泡到上层,也就是说,下层的DOM节点定义的事件处理函数,到了上层的节点如果还有和下层相同事件类型的事件处理函数,那么上层的事件处理函数也会执行。例如,div 标签包含了 a ,如果这两个标签都有onclick事件的处理函数,那么执行的情况就是先执行标签 a 的onclick事件处理函数,再执行div 的事件处理函数。如果希望的事件处理函数执行完毕之后,不希望执行上层的div 的onclick的事件处理函数了,那么就把cancelBubble设置为true即可。

js中事件处理的几种写法

2009-02-10 13:27

1.作为HTML属性值的事件处理程序

2.作为JavaScript属性的事件处理程序

说明:可能受第一种方法的误导,你会觉得应该写成:document.getElementById("btn").onclick() = "alert('https://www.doczj.com/doc/bb4554066.html,');",这样写是错误的!其实第一种方法隐式的创建了一个函数,使用下边代码可以说明这一点,因为它检测出HTML属性值其实是一个函数:

上边是用直接量来创建函数,改成用function()语句的写法:

3.第三种方法

说明:诸如此类的方法还有function document.onclick(){},但这种方法在IE、FF中测试只有IE下可行,再改成function document.getElementById("btn").onclick(){}在IE、FF下都不行了,提示缺少标识符,其实这也不难解释,因为JavaScript标识符中本来就不允许出现点号,用document.getElementById("btn").onclick做标识符显然是错误的,但document.all.btn.onclick却又可以实在有点让人费解。

js也可以有自定义事件注入就是这么爽

在c#中有delegate,还有特殊的可以直接应用于事件编程的delegate,那就是event。而在

js中没有c#的event,更没有delegate,有的只是dom元素内置的的native的不可扩展的event,比如无法为input元素添加事件,只能在其拥有的事件(如onclick=handler)上扩展应用。那么

能不能做到自定义的事件模拟效果呢?答案是肯定的,也就是本文的主题。

首先弄明白一下事件的意图——可以在发生一件事的时候执行额外的代码,如document.attachEvent('onclick', function(){alert('u click document')}),当点击页面时(事

件发生了),就会执行我们为其挂接的其它代码(js中以function为语句集合,以下称为function),当然我们可以在一个事件上挂接任意多的function,这样就实现了一种灵活的可扩展编程接口。试

想如果可以像在元素事件扩展应用一样可以在任意对象的任意方法上扩展,那对于js编程来讲就更

加灵活了。先看一个例子,平时我们把相对对立的一个功能命名为一个function,并在需要的地方(通常是另一个function)调用以实现代码复用:

function F(){

this.method = function(){

alert('f.method is called')

g();

}

}

function g(){

alert(123)

}

var f = new F();

f.method()

我们把f.method中直接调用g改写一下,封装到一个Event对象中达到一样的效果,代码如下:

var Event = {

__list:[],

observe:function(obj, ev, fun){

this.__list.push({o:obj, e:ev, f:fun})

},

occor:function(obj, method){

var arr = []

for(var i=0; i

if(this.__list[i].o==obj && this.__list[i].e==method) arr.push(this.__list [i]);

}

for(var i=0; i

arr[i].f();

}

}

}

function F(){

this.method = function(){

alert('f.method is called')

Event.occor(this, 'method');

}

}

var f = new F();

Event.observe(f, 'method', function(){alert(123)})

f.method()

这样乍看上去好像费了“太多”功夫,但却把“在f中调用g的写法”更通用化了,如果要在f中调用h 则只需要多些一行Event.occor(this, 'methodName'),写到这里你肯定也注意到methodName 的写法和最开始的写法是一样的,都是硬编的不具灵活性,如果在每个类的方法中都写入Event.occor(this, 'method')就太不雅观了,也背离了我们的初衷,动态修改一下method把它加到最后一行就ok了,下一步就是解决它,改进代码如下:

var Event = {

__list:[],

observe:function(obj, ev, fun){

this.__list.push({o:obj, e:ev, f:fun})

},

occor:function(obj, method){

var arr = []

for (var i=0; i

{ if (this .__list[i].o==obj && this .__list[i].e==method) arr .push(this .__list [i]);

}

for (var i=0; i

{ arr[i].f();

}

},

inject:function (obj)

{ for (var p in obj)

{ obj[p] = new Function(obj[p].toString().replace('function (){', '').repla ce('}', 'Event.occor(this,p)'))

}

}

}

function F(){

this .method = function ()

{ alert('f.method is called')

}

}

var f = new F();

Event.inject(f);

Event.observe(f, 'method', function ()

{alert(123)}) f.method()

我们把显示的在被调用方法体内调用Event.occor 改写到Event.inject 中。到此我们就简单(还有一些安全代码没有处理,如没有判断obj[p]是否需要被改写、没有测试效率问题,没有处理更多添加Event.occor 时的逻辑判断,下一步准备把它实现为一个Observeable 对象,就更加灵活了)的完成了自定义事件。

js 中函数的两种定义方式

(2009-08-26 14:15:18)

转载 标签: 两

js

函数

window

变量

it 分类: javascript

分别有函数定义如下:

1、var a = function();

2、function a(){}

要理解这两个异同,建议树立JS对象的概念.

相同点:这里的a都是一个function的对象,即typeof a == 'function'返回true,a都可以当一个方法直接调用,即a();也可以当一个对象传递到任何地方。

不同点:1这种形式只支持变量的定义,凡是符合js命名规则的变量均可以把function(){}赋给它。而2这种形式可以支持function obj.attr(){}的形式,比如常见的function window.onload(){};而这个时候你不能写成varwindow.onload = function(){};必须把var 去掉。其次,在创建她们对象方面,都可以使用var obj = new a();的形式,没有差别;在处理var t = {a:function(){}};此时,就只能使用1这种形式了。因为2无能为力

javascript中id和name的区别

文章分类:Java编程

javascript中id和name的区别

id一般来说是唯一的,调用的时候直接用id名就可以了,而name不一定是唯一的,调用的时候一定要用https://www.doczj.com/doc/bb4554066.html,来使用。

name原来是为了标识之用,但是现在根据规范,都建议用id来标识元素。但是name在以下用途是不能替代的:

1. 表单(form)的控件名,提交的数据都用控件的name而不是id来控制。因为有许多name会同时对应多个控件,比如checkbox和radio,而id必须是全文档中唯一的。此外浏览器会根据name来设定发送到服务器的request。因此如果用id,服务器是无法得到数据的。

2. frame和window的名字,用于在其他frame或window指定target。

以下两者可以通用,但是强烈建议用id不要用name:

锚点,通常以前写作,现在可以用任何的元素id来指定:

以下只能用id:

1. label与form控件的关联,

for属性指定与label关联的元素的id,不可用name替代。

2. CSS的元素选择机制,以#MyId的方式指定应用样式的元素,不能用name替代。

3. 脚本中获得对象:

IE支持在脚本中直接以id(而不是name)引用该id标识的对象。例如上面的input,要在脚本中获得输入的内容,可以直接以MyInput.value来获得。

如果用DOM的话,则用document.getElementById("MyInput").value,如果要用name的话,

通常先得到包含控件的form,例如document.forms[0],然后从form再引用name,注意这样得到的是经过计算后将发送给服务器的值。

name与id的还有区别是:id要符合标识的要求,比如大小写敏感,最好不要包含下划线(因为不兼容CSS)。而name基本上没有什么要求,甚至可以用数字。

在html中,id与name都用来表示一个组件。它们的区别:

id 是唯一的指定一个组件。而name指定组件时,组件可以有相同的name.可以通过document.getElementById()与document.getElementsByName()得到验证

form用id来标识时,是可以在客户端脚本直接调用的。

HTML元素的属性id和name的区别

文章分类:Web前端

信息一:

id主要是在客户端脚本里用,name主要是用于获取提交表单的某表单域信息。在form里面,如果不指定Name的话,就不会发送到服务器端哦!

信息二:

input select form frame iframe 用name

table tr td div p span h1 li 用id

表单元素(form input textarea select)与框架元素(iframe frame)用name,这些元素都与表单(框架元素作用于form的target)提交有关,在表单的接收页面只接收有name的元素, 赋ID的元素通过表单是接收不到值的。

当然上述元素也可以赋ID值, 赋ID值的时候引用这些元素的方法就要变一下了.

赋name: document.formName.inputName document.frames("frameName")

赋ID : document.all.inputID document.all.frameID

只能赋ID不能赋name的元素:(除去与表单相关的元素都只能赋ID)

body li a table tr td th p div span pre dl dt dd font b 等等

信息三:

HTML、CSS里面关于id、class、name 属性的区别和用法

name和id

name原来是为了标识之用,但是现在根据规范,都建议用id来标识元素。

以下只能用name:

1. 表单(form)的控件名,提交的数据都用控件的name而不是id来控制。因为许多时候一个name会同时对应多个控件,比如checkbox和radio,而id必须是全文档中唯一的。此外浏览器会根据name来设定发送到服务器的request。因此如果用id,服务器是无法得到数据的。

2. frame和window的名字,用于在其他frame或window指定target。

以下只能用id:

1. label与form控件的关联,

for属性指定与label关联的元素的id,不可用name替代。

2. CSS的元素选择机制,以#MyId的方式指定应用样式的元素,不能用name替代。

3. 脚本中获得对象:

IE支持在脚本中直接以id(而不是name)引用该id标识的对象。例如上面的input,要在脚本中获

得输入的内容,可以直接以MyInput.value来获得。

如果用DOM的话,则用document.getElementById("MyInput").value,如果要用name的话,通常先

得到包含控件的form,例如document.forms[0],然后从form再引用name,注意这样得到的是经过计

算后将发送给服务器的值。

name与id的其他区别是:

id要符合标识的要求,比如大小写敏感,最好不要包含下划线(因为不兼容CSS)。而name基本上

没有什么要求,甚至可以用数字。

class和id

在一个HTML网页中,id是唯一的,即只有某一个标签,或某一个块的标识符是这个id。

class可重复使用,用来根据用户定义的标准对一个或多个元素进行标记和定义。

实际使用中,class可能对文字的排版等比较有用,而id则对宏观布局和设计放置各种元素较有用。

综合例子:

网页代码有

用CSS控制这个链接的停留样式,

可以这样写#m_blog div.opt a:hover{color:#D57813} 或#myLink:hover{color:#D57813}

信息四:

细说HTML元素的ID和Name属性的区别

几乎每个做过Web开发的人都问过,到底元素的ID和Name有什么区别阿?为什么有了ID 还要有Name呢?

而同样我们也可以得到最classical的答案:ID就像是一个人的身份证号码,而Name就像是他的名字,ID显然是唯一的,而Name是可以重复的。

上周我也遇到了ID和Name的问题,在页面里输入了一个input type="hidden",只写了一个ID='SliceInfo',赋值后submit,在后台用Request.Params["SliceInfo"]却怎么也去不到值。后来恍然大悟因该用Name来标示,于是在input里加了个Name='SliceInfo',就一切ok了。

第一段里对于ID和Name的解答说的太笼统了,当然那个解释对于ID来说是完全对的,它就是Client端HTML元素的Identity。而Name其实要复杂的多,因为Name有很多种的用途,所以它并不能完全由ID来代替,从而将其取消掉。

具体用途有:

用途1: 作为可与服务器交互数据的HTML元素的服务器端的标示,比如input、select、textarea、和button等。我们可以在服务器端根据其Name通过Request.Params取得元素提交

的值。

用途2: HTML元素Input type='radio'分组,我们知道radio button控件在同一个分组类,check操作是mutex的,同一时间只能选中一个radio,这个分组就是根据相同的Name属性来实现的。

用途3: 建立页面中的锚点,我们知道link是获得一个页面超级链接,如果不用href 属性,而改用Name,如:,我们就获得了一个页面锚点。

用途4: 作为对象的Identity,如Applet、Object、Embed等元素。比如在Applet对象实例中,我们将使用其Name来引用该对象。

用途5: 在IMG元素和MAP元素之间关联的时候,如果要定义IMG的热点区域,需要使用其属性usemap,使usemap="#name"(被关联的MAP元素的Name)。

用途6: 某些特定元素的属性,如attribute,和param。例如为Object定义参数。

显然这些用途都不是能简单的使用ID来代替掉的,所以HTML元素的ID和Name的却别并不是身份证号码和姓名这样的区别,它们更本就是不同作用的东西。

我们可以通过一段代码来分析一下其中的微妙差别:

代码如下:

在IE浏览器里,我们可以通过多少方法来索引到这个文本框对象?(为区别起见,我们把NAME和ID设成了不同的值)

1. oDemo

2. demoform.oDemo

3. document.all.oDemo

4. document.all.demoform.oDemo

5. document.forms[0].oDemo

6. document.forms['demoform'].oDemo

7. document.forms['demoform'].childNodes[0]

8. document.forms['demoform'].elements[0]

9. document.getElementById('oDemo2')

以上9种索引方法在IE6里面全部通过返回值测试,不过值得注意的是最后一种:在IE6里,我把索引对象写成document.getElementById('oDemo'),浏览器也能正确索引到对象,真是可怕的容错性啊!!

接着问题来了,我们把这段代码放在Mozilla Firefox 1.0里再执行一次,只有第7种方法返回“undefined”,其他的方法可以正确索引到对象,不过由于第3、4种方法用到了document.all 这个IE专有对象,FF1.0虽然返回了正确的值,不过却在控制台里发出了警告:警告:非标准的属性document.all。请使用W3C 的标准形式document.getElementById() 。

接下来我们把HTML文本类型定义得严格一点,在源代码开头加上:使HTML文本按照HTML4.01标准去解析,在IE6里照样全部通过返回值测试,不过在Mozilla Firefox 1.0里麻烦就大了,第3、4种方法没有

任何的返回值,而在控制台里发出了报错信息:错误:document.all has no properties ,而第7种方法依旧返回“undefined”。

小结

NAME主要应用在交互式网页,表单提交给某个服务器端脚本后接收变处理量使用。从源代码的规范性和兼容性角度出发,如在客户端脚本里要索引某个对象,建议用document.getElementById()

另外举个简单的例子:

用户名:

密码:

如果我要获得用户名和密码;JS用name获得的话,就得写成https://www.doczj.com/doc/bb4554066.html,ername.value;

document.form1.password.value;

用id获得:

docuement.getElementById("username");

docuement.getElementById("pwd");

有时候name 可能会出现相同的名字,所以这时候我们用name获得就无法确定获得的是哪个值了。

document.getElemntsByName("username");

这里得到的是一个数组

当然HTML元素的Name属性在页面中也可以起那么一点ID的作用,因为在DHTML 对象树中,我们可以使用document.getElementsByName来获取一个包含页面中所有指定Name元素的对象数组。

在这里顺便说一下,要是页面中有n(n>1)个HTML元素的ID都相同了怎么办?在DHTML对象中怎么引用他们呢?如果我们使用ASPX页面,这样的情况是不容易发生的,因为aspnet进程在处理aspx页面时根本就不允许有ID非唯一,这是页面会被抛出异常而不能被正常的render。要是不是动态页面,我们硬要让ID重复那IE怎么搞呢?这个时候我们还是可以继续使用document.getElementById获取对象,只不过我们只能获取ID重复的那些对象中在HTML Render时第一个出现的对象。而这时重复的ID会在引用时自动变成一个数组,ID重复的元素按Render的顺序依次存在于数组中。

Visit W3School!

src="/i/eg_mouse2.jpg" name="b1"

onmouseOver="mouseOver()"

onmouseOut="mouseOut()" />

// 我们已为图像添加了name 属性,这样JavaScript 就能找到它了。

JavaScript中取到form的值的方法

Html代码

1

2username:

3password:

4

5

可以通过以下三种方式(我所知道的)来取到值:

var show = document.fn.elements['username'].value;//注意这里fn是form的名字,而不是id var show = document.getElementById('username').value;

var show = fi['username'].value;//fi是form的id号码

在百度悬赏20分拿到一个很不错的答案:

1、通过对象的位置来引用,如下:

var msg=document.forms[0].elements[0].value;

2、通过name属性访问文档对象:

var msg=document.myForm.myText.value; //设name="myForm"和="myText"

3、通过id属性访问文档对象:

var msg=document.getElementById('myText');

4、通过联合数组访问文档对象:

var msg=document.forms['myForm'].elements['myText'].value; //只支持火狐!

var msg=document.forms('myForm').elements('myText').value; //只支持IE!

5、通过IE提供的item()方法访问文档对象:

var msg=document.forms.item("myText");

6、通过元素标签返回指定对像:

var msg=document.getElementsByTagName("tr"); //参数可以为'*',表示找所有的元素对象

7、多对象数组时可分步访问:

var myObj=document.objects;

var msg=myObj[i].value;

8、访问对象的所有子对象:

for (i=0;i

msgs=example.childNodes.item(i).nodeName;

或:

for (i=0;i

msgs=example.childNodes[i].nodeName;

window为浏览器窗口对象,为文档提供显示容器,即与浏览器相关,如窗口的大小和关闭窗口等属性及方法,属于最顶级对象...

document与上不同,即与当前载入的文档相关,包括当前浏览器窗口或框架区域中的所有内容,包含文本域,按钮...等HTML页面可访问元素.

element文档中的元素对象,是可见的,或者说是标签,不同于Node对象,这是我自已的理解,或许有不确切这处,请提出来,哈哈

JS中this的用法

this指针是面向对象程序设计中的一项重要概念,它表示当前运行的对象。在实现对象的方法时,可以使用this指针来获得该对象自身的引用。

和其他面向对象的语言不同,JavaScript中的this指针是一个动态的变量,一个方法内的this指针并不是始终指向定义该方法的对象的,在上一节讲函数的apply和call方法时已经有过这样的例子。为了方便理解,再来看下面的例子:

<script language="JavaScript" type="text/javascript">

<!--

//创建两个空对象

var obj1=new Object();

var obj2=new Object();

//给两个对象都添加属性p,并分别等于1和2

obj1.p=1;

obj2.p=2;

//给obj1添加方法,用于显示p的值

obj1.getP=function(){

alert(this.p); //表面上this指针指向的是obj1

}

//调用obj1的getP方法

obj1.getP();

//使obj2的getP方法等于obj1的getP方法

obj2.getP=obj1.getP;

//调用obj2的getP方法

obj2.getP();

//-->

</script>

从代码的执行结果看,分别弹出对话框显示1和2。由此可见,getP函数仅定义了一次,在不同的场合运行,显示了不同的运行结果,这是有this指针的变化所决定的。在obj1的getP 方法中,this就指向了obj1对象,而在obj2的getP方法中,this就指向了obj2对象,并通过this指针引用到了两个对象都具有的属性p。

由此可见,JavaScript中的this指针是一个动态变化的变量,它表明了当前运行该函数的对象。由this指针的性质,也可以更好的理解JavaScript中对象的本质:一个对象就是由一个或多个属性(方法)组成的集合。每个集合元素不是仅能属于一个集合,而是可以动态的属于多个集合。这样,一个方法(集合元素)由谁调用,this指针就指向谁。实际上,前面介绍的apply方法和call方法都是通过强制改变this指针的值来实现的,使this指针指向参数所指定的对象,从而达到将一个对象的方法作为另一个对象的方法运行。

每个对象集合的元素(即属性或方法)也是一个独立的部分,全局函数和作为一个对象方法定义的函数之间没有任何区别,因为可以把全局函数和变量看作为window对象的方法和属性。也可以使用new操作符来操作一个对象的方法来返回一个对象,这样一个对象的方法也就可以定义为类的形式,其中的this指针则会指向新创建的对象。在后面可以看到,

这时对象名可以起到一个命名空间的作用,这是使用JavaScript进行面向对象程序设计的一个技巧。例如:

代码片段

var namespace1=new Object();

namespace1.class1=function(){

//初始化对象的代码

}

var obj1=new namespace1.class1();

这里就可以把namespace1看成一个命名空间。

由于对象属性(方法)的动态变化特性,一个对象的两个属性(方法)之间的互相引用,必须要通过this指针,而其他语言中,this关键字是可以省略的。如上面的例子中:

obj1.getP=function(){

alert(this.p); //表面上this指针指向的是obj1

}

这里的this关键字是不可省略的,即不能写成alert(p)的形式。这将使得getP函数去引用上下文环境中的p变量,而不是obj1的属性。

JS事件挂接(详细)

最近学习了JS挂接事件,根据自己对JS挂接事件的了解,以及自己的实际操作。对相关知识进行了如下总结,希望可以帮到大家。 1、事件挂接的第一种方式: 例://不传递参数 function testBtn1(){ alert(1); alert(this);//this指的是window } //传递参数 function testBtn1(num){ alert(num);//num=100 } //同时挂接多个事件 1.将彻底屏蔽鼠标右键,无右键菜单 也可以用于网页中Table框架中

no
2.取消选取、防止复制 3.不准粘贴 4.防止复制 5.IE地址栏前换成自己的图标

说明:关于favicon.ico文件的制作。你可以先在FW中做一个图片,属于你自己站点一个小图标。然后在ACD see将文件属性改为*.ico,然后将你做的*.ICO 文件传到你的服务器目录中,然后就可以使用以上代码来实现,当别人登陆你的站点时,地址栏里使用的就是你自定义的图标了。很PP哦。 6.可以在收藏夹中显示出你的图标 在网页的〈head〉〈/head〉间加入以下语句: 〈link rel="shortcuticon" href="http://…/icon.ico"〉 即可。其中 icon.ico 为 16x16 的图标文件, 颜色不要超过 16 色。 说明:制作方法和上面的一样。只是显示的方式不同,这个是在别人收藏你的网页地址时显示的个性图标。也很PP. 7.关闭输入法 说明:这段代码是在表格提交时用到的。也就是在输入数据时不可以使用其他输入法模式。 网页经典代码(二) 8.永远都会带着框架 说明:frames.htm为你的网页,这也是保护页面的一种方法 9.防止被人frame 10.网页将不能被另存为

js事件委托

JavaScript中的事件委托 传统的事件处理 事件委托就是在一个页面上使用一个事件来管理多种类型的事件。这并不是一个新的想法,但对于把握性能来说却很重要。通常情况,你会在web应用程序中看到这样的代码:document.getElementById("help-btn").onclick = function(event){ openHelp(); }; document.getElementById("save-btn").onclick = function(event){ saveDocumen t(); }; document.getElementById("undo-btn").onclick = function(event){ undoChanges (); }; 这种传统的编码方式给每个元素分配单独的事件处理方法。对于交互少的站点来说,这样做是可以的。然而,对于大型的wen应用程序,当存在大量的事件处理的时候,就会显得反应迟钝。这里要关注的不是速度问题,而是内存占用问题。如果有数百个交互,DOM元素和JavaScript 代码就会有数百个关联。 web应用需要占用的内存越多,它的响应速度就越慢。事件委托能将这个问题减小。 事件冒泡及捕获 要不是事件的下面这些属性,事件委托将成为可能。早期的web开发,浏览器厂商很难回答一个哲学上的问题:当你在页面上的一个区域点击时,你真正感兴趣的是哪个元素。这个问题带来了交互的定义。在一个元素的界限内点击,显得有点含糊。毕竟,在一个元素上的点击同时也发生在另一个元素的界限内。例如单击一个按钮。你实际上点击了按钮区域、body元素的区域以及html元素的区域。

js事件处理

JavaScript组成 ECMAScript:JavaScript语法核心。 DOM:文档对象模型(Document Object Model),提供访问和操作网页内容的方法和接口。 BOM:浏览器对象模型(Browser Object Model),提供与浏览器交互的方法和接口。 JavaScript中有五种简单数据类型,也称为基本数据类型,分别是undefined、null、boolean、number和string。另外还有一种复杂数据类型——object对象类型。JavaScript是基于对象的语言,这意味着程序员既可使用系统自定义的对象,也可使用自己创建的对象。 1 文档的结构和遍历 ParaentNode 获取该节点的父节点 ChildNodes 获取该节点的子节点数组 FirstChild 获取该节点的第一个子节点 LastChild 获取该节点的最后一个子节点 NextSibing 获取该节点的下一个兄弟节点 PreviousSibing 获取该节点上的一个兄弟节点 一般地,节点至少拥有nodeType nodeName nodeValue这三个基本属性吗,节点的类型不同,这三个属性的值也不相同NodeType属性类型分别对应1到12的常数值 NodeType 节点的类型 1 元素节点 2 属性节点 3 文本节点 4CDATA节点 5 实体引用名节点 6 实体名称节点 7处理指令节点 8注释节点 9文档节点 10文档类型节点 11 文档片段节点 12 DTD声明节点

网站登陆事件js源代码

1 显示登陆事件 时间日期篇--显示登陆时间

时间日期篇--显示登陆时间




您已登录本站

js事件说明

JS事件 事件 / 描述 onblur 事件发生在窗口失去焦点的时候。 onchange 事件发生在文本输入区的内容被更改,然后焦点从文本输入区移走之后。onclick 事件发生在对象被单击的时候。 onerror 事件发生在错误发生的时候。 onfocus 事件发生在窗口得到焦点的时候。 onload 事件发生在文档全部下载完毕的时候。 onmousedown 事件发生在用户把鼠标放在对象上按下鼠标键的时候。参考 onmouseup 事件。 onmouseout 事件发生在鼠标离开对象的时候。参考 onmouseover 事件。onmouseover 事件发生在鼠标进入对象范围的时候。 onmouseup 事件发生在用户把鼠标放在对象上鼠标键被按下的情况下,放开鼠标键的时候。 onreset 事件发生在表单的“重置”按钮被单击(按下并放开)的时候。 onresize 事件发生在窗口被调整大小的时候。 onsubmit 事件发生在表单的“提交”按钮被单击(按下并放开)的时候。 onunload 事件发生在用户退出文档(或者关闭窗口,或者到另一个页面去)的时候。onSelect 当Text或Textarea对象中的文字被加亮后,引发该事件。 onFocus 当用户单击Text或textarea以及select对象时,产生该事件。 onBlur 当text对象或textarea对象以及select对象不再拥有焦点、而退到后台时,引发该文件. onDragDrog 拖放时发生 onLoseCapture onDblClick 鼠标双击事件 onKeyPress 当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象] onKeyDown 当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象] onKeyUp 当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象] onAbort 图片在下载时被用户中断 onBeforeUnload 当前页面的内容将要被改变时触发的事件 onMove 浏览器的窗口被移动时触发的事件

Webkit里js与dom事件处理分析

1.event传递到js 所有的事件都是以WebViewWndProc作为入口点。我们以鼠标事件为例来分析,其它事件基本类似 在WebView里又对不同类型的事件处理做了分类主要有 鼠标事件:handleMouseEvent 键盘事件:keyDown, keyUp 在EventHandler类里开始对Event进行派发 EventHandler::dispatchMouseEvent 在这里EventHandler 是frame的一个对象,见frame.h文件 mutable EventHandler m_eventHandler; 在EventHandler记录了当前dom树中关于事件的结点所有信息,例如,当前处于鼠标下面的结点,最后处于鼠标下面的结点,最后处于鼠标下面的Scrollbar等。EventHandler里要做的事情就是在有事件发生的时候找到注册了该事件的结点,然后更新这些结点,并调用相应结点的事件处理函数。这些事情是在dom 结点本身结构的支持下完成的,凡是支持事件的dom结点都是继承于EventNode,而所有的dom结点类型都继承与Node。 在Node里有这样一个方法dispatchGenericEvent将事件进一步派发到EventTarget在EventTarget里会触发RegisteredEventListener 里注册的结点的事件处理函数 对于js事件,到了这一步又有一个js事件的入口点: JSEventListener::handleEvent JSEventListener从其类型的命名可以看出它是一个js事件监听者对象,既然有js事件监听者,那可以想象就有更一般的事件监听者,在webcoe里也确实是这样。上面是从处理事件的流程分析了这个过程,可能大家还会有疑问,事件是怎么派发到js监听者的?下面分析事件监听者注册的过程。 在html解析的时候即HTMLParser::parseToken(Token* t),分析到一个token有事件属性,就会将该属性添加到相应的存储结构里,在这里我们只分析事件属性,在分析到该token有event属性的时候(形容

代码触发超链接 Javascript代码 $(function() { $("#btn").click(function() { $("#submit").click(); $("#aLink").click(); }); }); 当单击:Click Me按钮时,先后弹出提交按钮被单击、超链接被单击的对话框,这表明两者的单击事件都被触发了。然而,从地址栏中可以看到,提交按钮的单击事件触发后,执行了它的默认行为:提交表单;可是超链接的单击事件触发后,并没有链接到目标地址。(不要怀疑说是提交按钮的提交地址对超链接有影响,因为我去掉提交按钮,只留下超链接也不会链接到目标地址。) 也许jQuery中的click()方法对超链接的单击事件并没有使其执行浏览器的默认行为(即使你手动加入return true也没有用)。注意:tigger("click")与click()一样的。jQuery 文档中说“这个函数也会导致浏览器同名的默认行为的执行”。同名的?不太明白,但是超链接的确不能执行它的默认行为。这是,只能想另外的方法——抛弃jQuery提供的事件。回到JavaScript自己的事件——click。代码如下: Javascript代码 $(function() { $("#btn").click(function() { $("#submit").click(); $("#aLink").get(0).click(); }); });

js事件

关于丢失键盘焦点的问题 var tf:TextField = new TextField(); tf.text = "请按任意键"; addChild(tf); this.stage.addEventListener(KeyboardEvent.KEY_DOWN, keydownHandler); function keydownHandler (evt:KeyboardEvent):void { tf.text = "按键码:" + evt.keyCode; } my_btn.addEventListener(MouseEvent.MOUSE_DOWN, clickHandler); function clickHandler (evt:MouseEvent):void { removeChild(my_btn); } // my_btn为场景中一普通按钮[SampleButton]实例 运行效果是这样的: 一开始按键是没问题的,tf能正常显示键值 然后点一下按钮后,再按键,事件就不响应了 经过分析是这么一会事: 点击按钮时,焦点在按钮上,按钮消失了,舞台就失去焦点了 function clickHandler (evt:MouseEvent):void { removeChild(my_btn); stage.focus = null; //在这里将焦点回归舞台} 这样设置下焦点就又可以继续响应按键了。 但是我想要问的是:如果都是这样的话,屏幕元件多了,岂不句句鼠标点击都要写这么一句么…… 难道没有其它解决办法吗?

https://www.doczj.com/doc/bb4554066.html,/thread-18785-1-1.html JS的event对象 Event属性和方法: 1. type:事件的类型,如onlick中的click; 2. srcElement/target:事件源,就是发生事件的元素; 3. button:声明被按下的鼠标键,整数,1代表左键,2代表右键,4代表中键,如果按下多个键,酒把这些值加起来,所以3就代表左右键同时按下;(firefox中0代表左键,1代表中间键,2代表右键) 4. clientX/clientY:事件发生的时候,鼠标相对于浏览器窗口可视文档区域的左上角的位置;(在DOM标准中,这两个属性值都不考虑文档的滚动情况,也就是说,无论文档滚动到哪里,只要事件发生在窗口左上角,clientX和clientY都是0,所以在IE中,要想得到事件发生的坐标相对于文档开头的位置,要加上 document.body.scrollLeft和document.body.scrollTop) 5. offsetX,offsetY/layerX,layerY:事件发生的时候,鼠标相对于源元素左上角的位置; 6. x,y/pageX,pageY:检索相对于父要素鼠标水平坐标的整数; 7. altKey,ctrlKey,shiftKey等:返回一个布尔值; 8. keyCode:返回keydown何keyup事件发生的时候按键的代码,以及keypress 事件的Unicode字符;(firefox2不支持event.keycode,可以用event.which替代) 9. fromElement,toElement:前者是指代mouseover事件中鼠标移动过的文档元素,后者指代mouseout事件中鼠标移动到的文档元素; 10. cancelBubble:一个布尔属性,把它设置为true的时候,将停止事件进一步起泡到包容层次的元素;(e.cancelBubble = true; 相当于e.stopPropagation();) 11. returnValue:一个布尔属性,设置为false的时候可以组织浏览器执行默认的事件动作; (e.returnValue = false; 相当于e.preventDefault();) 12. attachEvent(),detachEvent()/addEventListener(),removeEventListener:为制定DOM对象事件类型注册多个事件处理函数的方法,它们有两个参数,第一个是事件类型,第二个是事件处理函数。在 attachEvent()事件执行的时候,this关键字指向的是window对象,而不是发生事件的那个元素; 13. screenX、screenY:鼠标指针相对于显示器左上角的位置,如果你想打开新的窗口,这两个属性很重要;

js鼠标事件大全

J S鼠标事件大全 o n M o u s e O v e r I E3|N2|O3当鼠标移动到某对象范围的上方时触发的事件 o n M o u s e M o v e I E4|N4|O鼠标移动时触发的事件 o n M o u s e O u t I E4|N3|O3当鼠标离开某对象范围时触发的事件 o n K e y P r e s s I E4|N4|O当键盘上的某个键被按下并且释放时触发的事件.[注意:页面内必须有被聚焦的对象] o n K e y D o w n I E4|N4|O当键盘上某个按键被按下时触发的事件[注意:页面内必须有被聚焦的对象] o n K e y U p I E4|N4|O当键盘上某个按键被按放开时触发的事件[注意:页面内必须有被聚焦的对象] 页面相关事件 事件 浏览器支持 描述 o n A b o r t I E4|N3|O图片在下载时被用户中断 o n B e f o r e U n l o a d I E4|N|O当前页面的内容将要被改变时触发的事件 o n E r r o r I E4|N3|O捕抓当前页面因为某种原因而出现的错误,如脚本错误与外部数据引用的错误 o n L o a d I E3|N2|O3页面内空完成传送到浏览器时触发的事件,包括外部文件引入完成 o n M o v e I E|N4|O浏览器的窗口被移动时触发的事件 o n R e s i z e I E4|N4|O当浏览器的窗口大小被改变时触发的事件 o n S c r o l l I E4|N|O浏览器的滚动条位置发生变化时触发的事件 o n S t o p I E5|N|O浏览器的停止按钮被按下时触发的事件或者正在下载的文件被中断 o n U n l o a d I E3|N2|O3当前页面将被改变时触发的事件 表单相关事件 事件 浏览器支持 描述 o n B l u r I E3|N2|O3当前元素失去焦点时触发的事件 [鼠标与键盘的触发均可] o n C h a n g e I E3|N2|O3当前元素失去焦点并且元素的内容发生改变而触发的事件 [鼠标与键盘的触发均可] o n F o c u s I E3|N2|O3当某个元素获得焦点时触发的事件 o n R e s e t I E4|N3|O3当表单中R E S E T的属性被激发时触发的事件 o n S u b m i t I E3|N2|O3一个表单被递交时触发的事件 滚动字幕事件 事件 浏览器支持 描述 o n B o u n c e I E4|N|O在M a r q u e e内的内容移动至M a r q u e e显示范围之外时触发的事件 o n F i n i s h I E4|N|O当M a r q u e e元素完成需要显示的内容后触发的事件 o n S t a r t I E4|N|O当M a r q u e e元素开始显示内容时触发的事件 编辑事件 事件 浏览器支持 描述 o n B e f o r e C o p y I E5|N|O当页面当前的被选择内容将要复制到浏览者系统的剪贴板前触发的事件 o n B e f o r e C u t I E5|N|O当页面中的一部分或者全部的内容将被移离当前页面[剪贴]并移动到浏览者的系统剪贴板时触发的事件 o n B e f o r e E d i t F o c u s I E5|N|O当前元素将要进入编辑状态 o n B e f o r e P a s t e I E5|N|O内容将要从浏览者的系统剪贴板传送[粘贴]到页面中时触发的事件 o n B e f o r e U p d a t e I E5|N|O当浏览者粘贴系统剪贴板中的内容时通知目标对象 o n C o n t e x t M e n u I E5|N|O当浏览者按下鼠标右键出现菜单时或者通过键盘的按键触发页面菜单时触发的事件 [试试在页面中的中加入o n C o n t e n t M e n u="r e t u r n f a l s e"就可禁止使用鼠标右键了]

相关主题
文本预览