jquery怎么模擬點(diǎn)擊超

有時(shí)候我們需要頁面自動(dòng)點(diǎn)擊超鏈接或者按鈕，可以用js或者jQuery利用程序去點(diǎn)擊，方法很簡(jiǎn)單，按鈕或超鏈接代碼如下：

點(diǎn)擊超鏈接 點(diǎn)擊按鈕

上面是一個(gè)超鏈接和一個(gè)按鈕，并且超鏈接和按鈕都綁定了點(diǎn)擊事件

先看超鏈接，如果我們打算點(diǎn)擊超鏈接的同時(shí)不僅觸發(fā)事件而且跳轉(zhuǎn)到href的指定鏈接，可以用：

script

document.getElementById("alink").click();/script

這樣就可以實(shí)現(xiàn)上面的功能，但是如果我只想觸發(fā)事件而不想跳轉(zhuǎn)呢，方法有兩個(gè)，第一個(gè)是href寫上href="javascript:;"

另外的方法是引入jQuery，然后用jQuery點(diǎn)擊事件觸發(fā)

script

$("#alink").click();/script

這樣就不會(huì)跳轉(zhuǎn)了

如果是按鈕的話，直接用以下代碼：1 script2 //真正的用程序點(diǎn)擊按鈕3 document.getElementById("btn").click();4 //沒有點(diǎn)擊按鈕，只是執(zhí)行了按鈕所綁定的事件5 document.getElementById("btn").onclick();6 /script

JQuery怎么讓任意元素自動(dòng)點(diǎn)擊

你用jQuery選擇器選中后，添加事件就可以了呀。只要是jQuery對(duì)象，一般都可以點(diǎn)擊的，想打開頁面就自動(dòng)點(diǎn)擊的話，可以如下操作。

例如：p class="a"段落1/p

$(".a").click(function(){alert($(this).text())}).click();//打開頁面就自動(dòng)點(diǎn)擊了

jquery 點(diǎn)擊事件點(diǎn)擊元素添加和移除class

可以使用：$("#but").removeAttr("class");和$("#but").attr("class","but_test");來對(duì)標(biāo)簽進(jìn)行元素的添加和刪除。

為了直觀性的看到結(jié)果，首先在css樣式中，針對(duì)class選擇該元素，之后添加相應(yīng)的樣式。

接下來，就給該button按鈕添加一個(gè)點(diǎn)擊事件，讓它能過自由切換。

對(duì)該點(diǎn)擊事件添加js函數(shù)。

運(yùn)行后的結(jié)果為：

拓展資料：

jQuery是一個(gè)快速、簡(jiǎn)潔的JavaScript框架，是繼Prototype之后又一個(gè)優(yōu)秀的JavaScript代碼庫（或JavaScript框架）。它封裝JavaScript常用的功能代碼，提供一種簡(jiǎn)便的JavaScript設(shè)計(jì)模式，優(yōu)化HTML文檔操作、事件處理、動(dòng)畫設(shè)計(jì)和Ajax交互。

jquery鼠標(biāo)點(diǎn)擊事件是什么？

定義和用法：

當(dāng)點(diǎn)擊元素時(shí)，會(huì)發(fā)生 click 事件。

當(dāng)鼠標(biāo)指針停留在元素上方，然后按下并松開鼠標(biāo)左鍵時(shí)，就會(huì)發(fā)生一次 click。

click() 方法觸發(fā) click 事件，或規(guī)定當(dāng)發(fā)生 click 事件時(shí)運(yùn)行的函數(shù)。

鼠標(biāo)事件是在用戶移動(dòng)鼠標(biāo)光標(biāo)或者使用任意鼠標(biāo)鍵點(diǎn)擊時(shí)觸發(fā)的。

1、click事件：點(diǎn)擊鼠標(biāo)左鍵時(shí)觸發(fā)

$('p').click(function(){});

示例：

123 $('p').click(function(){ ? ? ? ?alert('click function is running !'); ? ? ? });

2、dbclick事件：迅速連續(xù)的兩次點(diǎn)擊時(shí)觸發(fā)

$('p').dbclick(function(){});

示例：

123 $("button").dblclick(function(){ $("p").slideToggle();});

3、mousedown事件：按下鼠標(biāo)時(shí)觸發(fā)

$('p').mousedown(function(){});

示例

123 $("button").mousedown(function(){ $("p").slideToggle();});

4、mouseup事件：松開鼠標(biāo)時(shí)觸發(fā)

$('p').mouseup(function(){});

示例：

123 $("button").mouseup(function(){ $("p").slideToggle();});

5、mouseover事件：鼠標(biāo)從一個(gè)元素移入另一個(gè)元素時(shí)觸發(fā)

mouseout事件：鼠標(biāo)移出元素時(shí)觸發(fā)

$('p').mouseover(function(){});

$('p').mouseout(function(){});

示例：

123456 $("p").mouseover(function(){ $("p").css("background-color","yellow");});$("p").mouseout(function(){ $("p").css("background-color","#E9E9E4");});

6、mouseenter事件：鼠標(biāo)移入元素時(shí)觸發(fā)

mouseleave事件：鼠標(biāo)移出元素時(shí)觸發(fā)

$('p').mouseenter(function(){});

$('p').mouseleave(function(){});

示例

123456 $("p").mouseenter(function(){ $("p").css("background-color","yellow");});$("p").mouseleave(function(){ $("p").css("background-color","#E9E9E4");});

7、hover事件

$('p').hover(

function(){},

function(){}

);

示例

123456789 $(".table_list tr").hover( function () { $(this).addClass("hover"); }, function () { $(this).removeClass("hover"); } );

8、toggle事件：鼠標(biāo)點(diǎn)擊切換事件

$('p').toggle(

function(){},

function(){}

);

示例

12345678 $("p").toggle( function(){ $("body").css("background-color","green");}, function(){ $("body").css("background-color","red");}, function(){ $("body").css("background-color","yellow");}

jquery，點(diǎn)擊一個(gè)節(jié)點(diǎn)，執(zhí)行某一事件，再次點(diǎn)擊，執(zhí)行另一個(gè)事件，要能循環(huán).

1、新建一個(gè)html文件，命名為test.html，用于講解gt;怎么讓jquery事件執(zhí)行一次。

2、在test.html文件內(nèi)，引入jquery.min.js庫文件，成功加載該文件，才能使用jquery中的方法。

3、在test.html文件內(nèi)，使用p標(biāo)簽創(chuàng)建一行文字，文字內(nèi)容為“這是一段測(cè)試的文字”,并設(shè)置其class為mypp。

4、在js標(biāo)簽內(nèi)，在頁面加載完成時(shí)，通過class(mypp)獲得p元素對(duì)象，使用one()方法給對(duì)象綁定click點(diǎn)擊事件，當(dāng)p元素被點(diǎn)擊時(shí)，執(zhí)行function()方法一次。

5、在function()方法內(nèi)，使用$(this)獲得p標(biāo)簽對(duì)象，使用text()方法取得p標(biāo)簽內(nèi)的值，把值保存在ny變量中。

6、在function()方法內(nèi)，使用alert()方法將獲得的內(nèi)容輸出來。

7、在瀏覽器打開test.html文件，點(diǎn)擊文字，查看實(shí)現(xiàn)的效果。

jquery綁定點(diǎn)擊事件的方法

jQuery綁定點(diǎn)擊事件可以使用其綁定事件函數(shù)

jquery中四個(gè)事件綁定方式（bind,live,delegate,on）

1、bind()????

簡(jiǎn)要描述

bind()向匹配元素添加一個(gè)或多個(gè)事件處理器。

使用方式

$(selector).bind(event,data,function)

event：必需項(xiàng)；添加到元素的一個(gè)或多個(gè)事件，例如 click,dblclick等；

單事件處理：例如?$(selector).bind("click",data,function);

多事件處理：

1.利用空格分隔多事件，例如?$(selector).bind("click dbclick mouseout",data,function);

2.利用大括號(hào)靈活定義多事件，例如?$(selector).bind({event1:function, event2:function, ...})　

3.空格相隔方式：綁定較為死板，不能給事件單獨(dú)綁定函數(shù),適合處理多個(gè)事件調(diào)用同一函數(shù)情況；

大括號(hào)替代方式：綁定較為靈活，可以給事件單獨(dú)

綁定函數(shù)；　

data：可選；需要傳遞的參數(shù)；

function：必需；當(dāng)綁定事件發(fā)生時(shí)，需要執(zhí)行的函數(shù)；

適用Jquery版本

適用所有版本，但是根據(jù)官網(wǎng)解釋，自從jquery1.7版本以后bind()函數(shù)推薦用on()來代替。

2、live()? ?

簡(jiǎn)要描述

live()?向當(dāng)前或未來的匹配元素添加一個(gè)或多個(gè)事件處理器；

使用方式

$(selector).live(event,data,function)

event：必需項(xiàng)；添加到元素的一個(gè)或多個(gè)事件，例如 click,dblclick等；

單事件處理：例如?$(selector).live("click",data,function);

多事件處理：1.利用空格分隔多事件，例如?$(selector).live("click dbclick mouseout",data,function);

2.利用大括號(hào)靈活定義多事件，例如?$(selector).live({event1:function, event2:function, ...})　

3.空格相隔方式：綁定較為死板，不能給事件單獨(dú)綁定函數(shù),適合處理多個(gè)事件調(diào)用同一函數(shù)情況；

大括號(hào)替代方式：綁定較為靈活，可以給事件單獨(dú)綁定函數(shù)；　

data：可選；需要傳遞的參數(shù)；

function：必需；當(dāng)綁定事件發(fā)生時(shí)，需要執(zhí)行的函數(shù)；

適用Jquery版本

jquery1.9版本以下支持，jquery1.9及其以上版本刪除了此方法，jquery1.9以上版本用on()方法來代替。

3、delegate()

簡(jiǎn)要描述

delegate()?為指定的元素（被選元素的子元素）添加一個(gè)或多個(gè)事件處理程序，并規(guī)定當(dāng)這些事件發(fā)生時(shí)運(yùn)行的函數(shù)。使用 delegate() 方法的事件處理程序適用于當(dāng)前或未來的元素（比如由腳本創(chuàng)建的新元素）。

使用方式　

$(selector).delegate(childSelector,event,data,function)

childSelector:?必需項(xiàng)；需要添加事件處理程序的元素，一般為selector的子元素；

event：必需項(xiàng)；添加到元素的一個(gè)或多個(gè)事件，例如 click,dblclick等；

單事件處理：例如?$(selector).delegate(childselector,"click",data,function);

多事件處理：1.利用空格分隔多事件，例如?$(selector).delegate(childselector,"click?dbclick mouseout",data,function);

2.利用大括號(hào)靈活定義多事件，例如?$(selector).delegate(childselector,{event1:function, event2:function, ...})　

3.空格相隔方式：綁定較為死板，不能給事件單獨(dú)綁定函數(shù),適合處理多個(gè)事件調(diào)用同一函數(shù)情況；

大括號(hào)替代方式：綁定較為靈活，可以給事件單獨(dú)綁定函數(shù)；　

data：可選；需要傳遞的參數(shù)；

function：必需；當(dāng)綁定事件發(fā)生時(shí)，需要執(zhí)行的函數(shù)；

適用Jquery版本

jquery1.4.2及其以上版本；

4、on()

簡(jiǎn)要描述

on()?為指定的元素,添加一個(gè)或多個(gè)事件處理程序，并規(guī)定當(dāng)這些事件發(fā)生時(shí)運(yùn)行的函數(shù)。使用 on() 方法的事件處理程序適用于當(dāng)前或未來的元素（比如由腳本創(chuàng)建的新元素）。

使用方式　

$(selector).on(event,childselector,data,function)

event：必需項(xiàng)；添加到元素的一個(gè)或多個(gè)事件，例如 click,dblclick等；

單事件處理：例如?$(selector).on("click",childselector,data,function);

多事件處理：1.利用空格分隔多事件，例如?$(selector).on("click?dbclick mouseout",childseletor,data,function);

2.利用大括號(hào)靈活定義多事件，例如?$(selector).on({event1:function, event2:function, ...},childselector);　

3.空格相隔方式：綁定較為死板，不能給事件單獨(dú)綁定函數(shù),適合處理多個(gè)事件調(diào)用同一函數(shù)情況；

大括號(hào)替代方式：綁定較為靈活，可以給事件單獨(dú)綁定函數(shù)；　

childSelector:?可選；需要添加事件處理程序的元素，一般為selector的子元素；

data：可選；需要傳遞的參數(shù)；

function：必需；當(dāng)綁定事件發(fā)生時(shí)，需要執(zhí)行的函數(shù)；

適用Jquery版本

jquery1.7及其以上版本；jquery1.7版本出現(xiàn)之后用于替代bind()，live()綁定事件方式；

四種方式的異同和優(yōu)缺點(diǎn)

相同點(diǎn)：

1.都支持單元素多事件的綁定；空格相隔方式或者大括號(hào)替代方式;

2.均是通過事件冒泡方式，將事件傳遞到document進(jìn)行事件的響應(yīng)；

比較和聯(lián)系:

1.bind()函數(shù)只能針對(duì)已經(jīng)存在的元素進(jìn)行事件的設(shè)置；但是live(),on(),delegate()均支持未來新添加元素的事件設(shè)置；

2.bind()函數(shù)在jquery1.7版本以前比較受推崇，1.7版本出來之后，官方已經(jīng)不推薦用bind()，替代函數(shù)為on(),這也是1.7版本新添加的函數(shù)，同樣，可以

用來代替live()函數(shù)，live()函數(shù)在1.9版本已經(jīng)刪除；

3.live()函數(shù)和delegate()函數(shù)兩者類似，但是live()函數(shù)在執(zhí)行速度，靈活性和CSS選擇器支持方面較delegate()差些

4.bind()支持Jquery所有版本；live()支持jquery1.8-；delegate()支持jquery1.4.2+；on()支持jquery1.7+；　

總結(jié)

如果項(xiàng)目中引用jquery版本為低版本，推薦用delegate(),高版本jquery可以使用on()來代替，以上僅為個(gè)人看法