java点击按钮触发ajax_javascript/jquery实现点击触发事件的方法分析

本文实例讲述了javascript/jquery实现点击触发事件的方法。分享给大家供大家参考，具体如下：

点击事件

原声态 和 jquery

language="java"

pageEncoding="utf-8"

contentType="text/html;charset=utf-8"

import="Tool.Tool"

isELIgnored="false"

%>

test1

我是按钮

//onclick点击事件

//方案一 ： 原生态onclick

(function(){

var demo = document.getElementById("demo");

demo.οnclick=function(){

alert("我是方案一");

}

})();

//方案二 : jquery 选择器选择demo 添加时间

//$(function(){}) 当页面加载完成后会执行$()包含的方法

$(function(){

$("#demo").click(function(){

alert("我是方案二");

})

})

//方案三 : 原生态事件监听

//部分浏览器不支持addEventListener 事件监听，所以使用的时候先判定一下浏览器是否支持

(function(){

var demo = document.getElementById("demo");

if(window.addEventListener)

{

demo.addEventListener("click",function(){

alert("我是方案三");

})

}

})();

//方案四 ： jquery 事件绑定

// 即能给指定元素添加点击事件，又能随时解除点击时间

$(function(){

$("#demo").bind("click",function(){

//使用$("#demo").unbind("click") 也可以实现同样效果

$(this).unbind("click");

alert("我是方案四")

})

})

//方案五 ： 移动端支持 - touchstart 事件点击事件 jquery

//当手指触碰某个元素后触发

$(function(){

$("#demo").bind("touchstart",function(){

alert("我是方案五");

})

})

//方案六 ： 原生态版本 - touchstart 事件

(function(){

document.getElementById("demo").addEventListener("touchstart",function(){

alert("我是方案六");

})

})()

感兴趣的朋友可以使用在线HTML/CSS/JavaScript代码运行工具 http://tools.jb51.net/code/HtmlJsRun 测试上述代码运行效果。

希望本文所述对大家jQuery程序设计有所帮助。