1.例子说明
 <!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>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

 <title></title>

 <script src="../../scripts/jquery-1.3.1.js" type="text/javascript"></script>

 <script type="text/javascript">

 $(function(){

    $("#sub").bind("click",function(event){

          var username = $("#username").val();  //获取元素的值

          if(username==""){     //判断值是否为空

              $("#msg").html("<p>文本框的值不能为空.</p>");  //提示信息

              event.preventDefault();  //阻止默认行为 ( 表单提交 )

          }

          else if(username==$("#username").val()){

              $("#msg").html("<p>username="+username+"</p>");  //提示信息

             // event.preventDefault();  //阻止默认行为 ( 表单提交 )

          }

    })

 })

 </script>

 </head>

 <body>

 <form action="4-4-3-1.html">

 用户名：<input type="text" id="username" />

 <br/>

 <input type="submit" value="提交" id="sub"/>

 </form>

 <div id="msg"></div>

 </body>

 </html>

（1）获取元素的值----10行

（2）html中输出元素的值----16行

（3）event.preventDefault(); //阻止默认行为 ( 表单提交 )如果注释掉此句，点击提交按钮由<form action="4-4-3-1.html">可知会转到4-4-3-1.html页面

2事件对象的属性

2.1event.type

 $(function(){

     $("a").click(function(event) {

       alert(event.type);//获取事件类型

       return false;//阻止链接跳转

     });

 })

事件类型是click

2.2.event.target

 $(function(){

     $("a[href=http://google.com]").click(function(event) {

       alert(event.target.href);//获取触发事件的<a>元素的href属性值

       return false;//阻止链接跳转

     });

 })

event.target.href是http://google.com

2.3.event.pageX,pageY

 $(function(){

     $("a").click(function(event) {

       alert("Current mouse position: " + event.pageX + ", " + event.pageY );//获取鼠标当前相对于页面的坐标

       return false;//阻止链接跳转

     });

 })

2.4.event.which

 $(function(){

     $("a").mousedown(function(e){

         alert(e.which)  // 1 = 鼠标左键 left; 2 = 鼠标中键; 3 = 鼠标右键

         return false;//阻止链接跳转

     })

 })

2.5.event.metaKey,event.ctrlKey

 $(function(){

     $("input").keyup(function(e){

         alert(e.metaKey +" "+e.ctrlKey );

         $(this).blur();

     })

 })


												


											
javascript---jquery (1事件)的更多相关文章
	

    
						
  1. javascript/jquery键盘事件介绍
		
    一.首先需要知道的是:1.keydown()keydown事件会在键盘按下时触发.2.keyup()keyup事件会在按键释放时触发,也就是你按下键盘起来后的事件3.keypress()keypres ...
    
		
    2. 
						
  2. [javascript]jQuery绑定事件方法：on()
		
    语法: $(selector).on(event,childSelector,data,function) on(event,childSelector,data,function):在被选元素及子元 ...
    
		
    3. 
						
  3. jQuery 的ready事件和 JavaScript 的load事件对比
		
    为了理解2个事件的异同,先了解一下HTML文档加载顺序 HTML DOM文档加载步骤 HTML DOM文档加载是按顺序执行的,这与浏览器的渲染方式有关,一般浏览器渲染操作的顺序大致按如下几个步骤 1, ...
    
		
    4. 
						
  4. JavaScript的 onclick 事件是如何调用jquery 方法的
		
    看见个不错的问答,关于JavaScript的 onclick 事件是如何调用jquery 方法的,特此标注,链接如下:http://segmentfault.com/q/101000000033350 ...
    
		
    5. 
						
  5. JS:   javascript 点击事件执行两次js问题 ,解决jquery绑定click事件出现点击一次执行两次问题
		
    javascript 点击事件执行两次js问题 在JQuery中存在unbind()方法,先解绑再添加点击事件,解决方案为: $(".m-layout-setting").unbi ...
    
		
    6. 
						
  6. JavaScript window.onload 事件和 jQuery ready 函数有何不同？
		
    JavaScript window.onload 事件和 jQuery ready 函数之间的主要区别是,前者除了要等待 DOM 被创建还要等到包括大型图片.音频.视频在内的所有外部资源都完全加载.如 ...
    
		
    7. 
						
  7. 使用jQuery在javascript中自定义事件
		
    js中的自定义事件有attachEvent,addEventListener等等好多种,往往受困于浏览器兼容,而且代码写起来也相当麻烦.jQuery为我们解决了这个问题,几行代码就可以很好的实现事件的 ...
    
		
    8. 
						
  8. Jquery的事件操作和文档操作
		
    对于熟悉前端开发的小伙伴,相信对于Jquery一定不陌生,相对于JavaScript的繁琐,Jquery更加的简洁,当然简洁不意味着简单,我们可以使用Jquery完成我们想要实现全部功能,这里为小白们 ...
    
		
    9. 
						
  9. 从零开始学习jQuery (五) 事件与事件对象
		
    本系列文章导航 从零开始学习jQuery (五) 事件与事件对象 一.摘要 事件是脚本编程的灵魂. 所以本章内容也是jQuery学习的重点. 本文将对jQuery中的事件处理以及事件对象进行详细的讲解 ...
    
		
    10. 
						
  10. jquery css事件编程  尺寸设置
		
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
    
		
    11. 
		

	


随机推荐
	

    
									
  1. hashmap源码
			
    Java里各种基础容器的实现都是链表外加引用的形式.So,hashmap也不例外. 那小考虑下:hashmap是怎么产生的呢? 常用的两种数据结构数组和链表各有优劣,数组寻址容易,插入和删除困难:而链 ...
    
			
    2. 
						
  2. 虚拟ip
			
    网卡上增加一个IP: ifconfig eth0:1 192.168.0.1 netmask 255.255.255.0 删除网卡的第二个IP地址: ip addr del 192.168.0.1 d ...
    
			
    3. 
						
  3. 转 ORACLE数据库它可以存储 中文 字节或字符
			
    一:因为ORACLE数据库它可以存储字节或字符,例如 CHAR(12 BYTE) CHAR(12 CHAR)的意义是不同的.一般来说默认是存储字节,你可以查看数据库参数NLS_LENGTH_SEMAN ...
    
			
    4. 
						
  4. Recover Polygon (easy)
			
    Recover Polygon (easy) The zombies are gathering in their secret lair! Heidi will strike hard to des ...
    
			
    5. 
						
  5. 【转】CentOS安装PF_RING（虚拟机）
			
    1.       概述 PF_RING是Luca Deri发明的提高内核处理数据包效率,并兼顾应用程序的补丁,如Libpcap和TCPDUMP等,以及一些辅助性程序(如ntop查看并分析网络流量等). ...
    
			
    6. 
						
  6. HDU 1896 Stones（优先队列）
			
    还是优先队列 #include<iostream> #include<cstdio> #include<cstring> #include<queue> ...
    
			
    7. 
						
  7. 转：使用WITH AS提高性能简化嵌套SQL
			
    使用WITH AS提高性能简化嵌套SQL   一．WITH AS的含义 WITH AS短语,也叫做子查询部分(subquery factoring),可以让你做很多事情,定义一个SQL片断,该SQL片 ...
    
			
    8. 
						
  8. 定时且周期性的任务研究I--Timer
			
    很多时候我们希望任务可以定时的周期性的执行,在最初的JAVA工具类库中,通过Timer可以实现定时的周期性的需求,但是有一定的缺陷,例如:Timer是基于绝对时间的而非支持相对时间,因此Timer对系 ...
    
			
    9. 
						
  9. Delph组件如何使用自己的图标(转)
			
    源:http://blog.csdn.net/henreash/article/details/7298451
    
			
    10. 
						
  10. 数据恢复软件Extundelete
			
    数据恢复软件Extundelete介绍 一.概述 作为一名运维人员,保证数据的安全是根本职责,所以在维护系统的时候,要慎重和细心,但是有时也难免发生出现数据被误删除的情况,这个时候该如何快速.有效地恢 ...
    
			
    11.