1、新建一個html文件，命名為test.html，用于講解gt;怎么讓jquery事件執(zhí)行一次。
成都創(chuàng)新互聯(lián)公司于2013年成立，公司以成都做網(wǎng)站、成都網(wǎng)站設(shè)計、系統(tǒng)開發(fā)、網(wǎng)絡(luò)推廣、文化傳媒、企業(yè)宣傳、平面廣告設(shè)計等為主要業(yè)務(wù)，適用行業(yè)近百種。服務(wù)企業(yè)客戶近千家，涉及國內(nèi)多個省份客戶。擁有多年網(wǎng)站建設(shè)開發(fā)經(jīng)驗。為企業(yè)提供專業(yè)的網(wǎng)站建設(shè)、創(chuàng)意設(shè)計、宣傳推廣等服務(wù)。 通過專業(yè)的設(shè)計、獨特的風(fēng)格，為不同客戶提供各種風(fēng)格的特色服務(wù)。
2、在test.html文件內(nèi)，引入jquery.min.js庫文件，成功加載該文件，才能使用jquery中的方法。
3、在test.html文件內(nèi)，使用p標(biāo)簽創(chuàng)建一行文字，文字內(nèi)容為“這是一段測試的文字”,并設(shè)置其class為mypp。
4、在js標(biāo)簽內(nèi)，在頁面加載完成時，通過class(mypp)獲得p元素對象，使用one()方法給對象綁定click點擊事件，當(dāng)p元素被點擊時，執(zhí)行function()方法一次。
5、在function()方法內(nèi)，使用$(this)獲得p標(biāo)簽對象，使用text()方法取得p標(biāo)簽內(nèi)的值，把值保存在ny變量中。
6、在function()方法內(nèi)，使用alert()方法將獲得的內(nèi)容輸出來。
7、在瀏覽器打開test.html文件，點擊文字，查看實現(xiàn)的效果。
jQuery綁定點擊事件可以使用其綁定事件函數(shù)
jquery中四個事件綁定方式（bind,live,delegate,on）
1、bind()????
簡要描述
bind()向匹配元素添加一個或多個事件處理器。
使用方式
$(selector).bind(event,data,function)
event：必需項；添加到元素的一個或多個事件，例如 click,dblclick等；
單事件處理：例如?$(selector).bind("click",data,function);
多事件處理：
1.利用空格分隔多事件，例如?$(selector).bind("click dbclick mouseout",data,function);
2.利用大括號靈活定義多事件，例如?$(selector).bind({event1:function, event2:function, ...})
3.空格相隔方式：綁定較為死板，不能給事件單獨綁定函數(shù),適合處理多個事件調(diào)用同一函數(shù)情況；
大括號替代方式：綁定較為靈活，可以給事件單獨
綁定函數(shù)；
data：可選；需要傳遞的參數(shù)；
function：必需；當(dāng)綁定事件發(fā)生時，需要執(zhí)行的函數(shù)；
適用Jquery版本
適用所有版本，但是根據(jù)官網(wǎng)解釋，自從jquery1.7版本以后bind()函數(shù)推薦用on()來代替。
2、live()? ?
簡要描述
live()?向當(dāng)前或未來的匹配元素添加一個或多個事件處理器；
使用方式
$(selector).live(event,data,function)
event：必需項；添加到元素的一個或多個事件，例如 click,dblclick等；
單事件處理：例如?$(selector).live("click",data,function);
多事件處理：1.利用空格分隔多事件，例如?$(selector).live("click dbclick mouseout",data,function);
2.利用大括號靈活定義多事件，例如?$(selector).live({event1:function, event2:function, ...})
3.空格相隔方式：綁定較為死板，不能給事件單獨綁定函數(shù),適合處理多個事件調(diào)用同一函數(shù)情況；
大括號替代方式：綁定較為靈活，可以給事件單獨綁定函數(shù)；
data：可選；需要傳遞的參數(shù)；
function：必需；當(dāng)綁定事件發(fā)生時，需要執(zhí)行的函數(shù)；
適用Jquery版本
jquery1.9版本以下支持，jquery1.9及其以上版本刪除了此方法，jquery1.9以上版本用on()方法來代替。
3、delegate()
簡要描述
delegate()?為指定的元素（被選元素的子元素）添加一個或多個事件處理程序，并規(guī)定當(dāng)這些事件發(fā)生時運行的函數(shù)。使用 delegate() 方法的事件處理程序適用于當(dāng)前或未來的元素（比如由腳本創(chuàng)建的新元素）。
使用方式
$(selector).delegate(childSelector,event,data,function)
childSelector:?必需項；需要添加事件處理程序的元素，一般為selector的子元素；
event：必需項；添加到元素的一個或多個事件，例如 click,dblclick等；
單事件處理：例如?$(selector).delegate(childselector,"click",data,function);
多事件處理：1.利用空格分隔多事件，例如?$(selector).delegate(childselector,"click?dbclick mouseout",data,function);
2.利用大括號靈活定義多事件，例如?$(selector).delegate(childselector,{event1:function, event2:function, ...})
3.空格相隔方式：綁定較為死板，不能給事件單獨綁定函數(shù),適合處理多個事件調(diào)用同一函數(shù)情況；
大括號替代方式：綁定較為靈活，可以給事件單獨綁定函數(shù)；
data：可選；需要傳遞的參數(shù)；
function：必需；當(dāng)綁定事件發(fā)生時，需要執(zhí)行的函數(shù)；
適用Jquery版本
jquery1.4.2及其以上版本；
4、on()
簡要描述
on()?為指定的元素,添加一個或多個事件處理程序，并規(guī)定當(dāng)這些事件發(fā)生時運行的函數(shù)。使用 on() 方法的事件處理程序適用于當(dāng)前或未來的元素（比如由腳本創(chuàng)建的新元素）。
使用方式
$(selector).on(event,childselector,data,function)
event：必需項；添加到元素的一個或多個事件，例如 click,dblclick等；
單事件處理：例如?$(selector).on("click",childselector,data,function);
多事件處理：1.利用空格分隔多事件，例如?$(selector).on("click?dbclick mouseout",childseletor,data,function);
2.利用大括號靈活定義多事件，例如?$(selector).on({event1:function, event2:function, ...},childselector);
3.空格相隔方式：綁定較為死板，不能給事件單獨綁定函數(shù),適合處理多個事件調(diào)用同一函數(shù)情況；
大括號替代方式：綁定較為靈活，可以給事件單獨綁定函數(shù)；
childSelector:?可選；需要添加事件處理程序的元素，一般為selector的子元素；
data：可選；需要傳遞的參數(shù)；
function：必需；當(dāng)綁定事件發(fā)生時，需要執(zhí)行的函數(shù)；
適用Jquery版本
jquery1.7及其以上版本；jquery1.7版本出現(xiàn)之后用于替代bind()，live()綁定事件方式；
四種方式的異同和優(yōu)缺點
相同點：
1.都支持單元素多事件的綁定；空格相隔方式或者大括號替代方式;
2.均是通過事件冒泡方式，將事件傳遞到document進行事件的響應(yīng)；
比較和聯(lián)系:
1.bind()函數(shù)只能針對已經(jīng)存在的元素進行事件的設(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é)
如果項目中引用jquery版本為低版本，推薦用delegate(),高版本jquery可以使用on()來代替，以上僅為個人看法
jquery基礎(chǔ)事件，包括綁定事件、簡寫事件、復(fù)合事件；
一．綁定事件
jQuery 通過.bind()方法來為元素綁定這些事件。
形式：
bind(type, [data], fn)
參數(shù)：
type 表示一個或多個類型的事件名字符串；
[data]是可選的，作為 event.data 屬性值傳遞一個額外的數(shù)據(jù)，這個數(shù)據(jù)是一個字符串、一個數(shù)字、一個數(shù)組或一個對象；
fn 表示綁定到指定元素的處理函數(shù)。
二、簡寫事件
為了使開發(fā)者更加方便的綁定事件，jQuery 封裝了常用的事件以便節(jié)約更多的代碼。 稱之為簡寫事件。簡寫事件，綁定方法如下圖，
三、復(fù)合事件
jQuery 提供了許多最常用的事件效果， 組合一些功能實現(xiàn)了一些復(fù)合事件， 比如切換功?能、智能加載等。
擴展資料
1、綁定事件fn函數(shù)
1)使用點擊事件
$('input').bind('click', function () {//點擊按鈕后執(zhí)行匿名函數(shù)
alert('點擊！');
});
2)普通處理函數(shù)
$('input').bind('click', fn); //執(zhí)行普通函數(shù)式無須圓括號
function fn() {
alert('點擊！');
}
2、簡寫事件函數(shù)
1）.mouseover()和.mouseout()表示鼠標(biāo)移入和移出的時候觸發(fā)。而.mouseenter()和.mouseleave()表示鼠標(biāo)穿過和穿出的時候觸發(fā)。
2）.keydown()、.keyup()返回的是鍵碼，而.keypress()返回的是字符編碼。
3）.focus()和.blur()分別表示光標(biāo)激活和丟失，事件觸發(fā)時機是當(dāng)前元素。而.focusin()和.focusout()也表示光標(biāo)激活和丟失，但事件觸發(fā)時機可以是子元素。
3、復(fù)合事件示例，背景移入移出切換效果
$('div').hover(function () {
$(this).css('background', 'black');? ? ?//mouseenter 效果
}, function () {
$(this).css('background', 'red');? ? ? //mouseleave 效果，可省略
});
參考資料
jQuery官方網(wǎng)站-事件
Jquery觸發(fā)某個鏈接點擊事件可以參考下面的代碼：
$(document).ready(function (){
$("#tob").click(function (){
window.location.href = 'x.html';
});
});
擴展資料：
Jquery參考函數(shù)
$(“p”).addClass(css中定義的樣式類型); 給某個元素添加樣式?
$(“img”).attr({src:”test.jpg”,alt:”test Image”}); 給某個元素添加屬性/值，參數(shù)是map
$(“img”).attr(“src”,”test.jpg”); 給某個元素添加屬性/值
$(“img”).attr(“title”, function() { return this.src }); 給某個元素添加屬性/值
$(“元素名稱”).removeAttr(“屬性名稱”); 給某元素刪除指定的屬性以及該屬性的值
參考資料來源：百度百科-jQuery
定義和用法：
當(dāng)點擊元素時，會發(fā)生 click 事件。
當(dāng)鼠標(biāo)指針停留在元素上方，然后按下并松開鼠標(biāo)左鍵時，就會發(fā)生一次 click。
click() 方法觸發(fā) click 事件，或規(guī)定當(dāng)發(fā)生 click 事件時運行的函數(shù)。
鼠標(biāo)事件是在用戶移動鼠標(biāo)光標(biāo)或者使用任意鼠標(biāo)鍵點擊時觸發(fā)的。
1、click事件：點擊鼠標(biāo)左鍵時觸發(fā)
$('p').click(function(){});
示例：
123 $('p').click(function(){ ? ? ? ?alert('click function is running !'); ? ? ? });
2、dbclick事件：迅速連續(xù)的兩次點擊時觸發(fā)
$('p').dbclick(function(){});
示例：
123 $("button").dblclick(function(){ $("p").slideToggle();});
3、mousedown事件：按下鼠標(biāo)時觸發(fā)
$('p').mousedown(function(){});
示例
123 $("button").mousedown(function(){ $("p").slideToggle();});
4、mouseup事件：松開鼠標(biāo)時觸發(fā)
$('p').mouseup(function(){});
示例：
123 $("button").mouseup(function(){ $("p").slideToggle();});
5、mouseover事件：鼠標(biāo)從一個元素移入另一個元素時觸發(fā)
mouseout事件：鼠標(biāo)移出元素時觸發(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)移入元素時觸發(fā)
mouseleave事件：鼠標(biāo)移出元素時觸發(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)點擊切換事件
$('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");}
直接使用click事件是不起作用的，我平常使用的兩種方法
1、on事件
var html1='';
html1 +=`div
button type="button" class="btn btn-primary sure btn-mian" onclick="sure()"確認(rèn)提交/button
button type="button" class="btn btn-default " data-dismiss="modal"暫不提交/button
/div`
$('.modal-footer').append(html1);
$('div').on('click','.sure',function(){console.log("+++");});
2、onclick事件
var html1='';
html1 +=`div
button type="button" class="btn btn-primary sure btn-mian" onclick="sure()"確認(rèn)提交/button
button type="button" class="btn btn-default " data-dismiss="modal"暫不提交/button
/div`
$('.modal-footer').append(html1);
functionsure(){console.logO("===");}
需要獲取到div這個元素，可以通過id，class等等方式得到，比如說div的id為"div1",那么就可以這么寫了。$('#div1').click(function(){//這里面就是click事件的內(nèi)容了});
重慶分公司
重慶分公司
