jquery繫結click等事件無效解決方法live替代$().click不執行

阿新 • • 發佈：2019-02-16

場景：使用$(xxx).click();綁定了ajax請求後追加的html程式碼中的某個元素時。出現事件失效的情況，這是因為繫結事件程式碼在元素出現之前就已經執行

>解決方法：可以使用live替代click，但是live方法在1.7中已經不建議使用，在1.9中刪除了這個方法，並建議使用on方法來替代。具體實現demo如下：

<body>
    <button id="btn1">BTN1</button>
</body>
<script type="text/javascript">
/* 在id=btn1後面新增按鈕 */ 

function addBtn(){
    var btn = $("<button></button>").append("BTN2").attr("id", "btn2");
    $("#btn1").after(btn);
}
$(function(){
    /* 2秒之後執行新增按鈕方法 */
    setTimeout("addBtn()", 2000);
    /* 給新新增按鈕繫結click事件 */
    $(document.body).on("click","#btn2", function(){
        alert("Hello Jquery !" 
);
    });
});
</script>

jquery繫結click等事件無效解決方法live替代$().click不執行

場景：使用$(xxx).click();綁定了ajax請求後追加的html程式碼中的某個元素時。出現事件失效的情況，這是因為繫結事件程式碼在元素出現之前就已經執行 >解決方法：

chrome瀏覽器模擬手機端：jquery click()點選無效解決方法

$(".sku-wrap .ok").click(); chrome瀏覽器模擬手機端，在油猴外掛中寫JS程式碼，然後發現click()點選失效。解決方法：jquery的click()方法失效，可以使用原生JavaScript的click方法。首先需要將jquery物件轉化成JS物件：

使用jquery mobile Collapsible Widget 時繫結expand,collapse事件監聽器的方法

根據官方文件，expand事件監聽由expand(event,ui)來實現 expand( event, ui )Type: collapsibleexpand Triggered when a collapsible is expanded 繫結event li

js後加載頁面元素，繫結時間都無法用解決方法

問題如下，頁面的table元素動態新增，當對table中的input做限制的時候無法操作，先看程式碼： $("#defaultView_content input").attr("disabled","disabled"); 然後噁心的我抓狂，後來通過谷歌搜了一波，果然： $('#defa

SpringMVC繫結引數中的亂碼解決方法（Post與Get）

post解決方法：在web.xml中配置如下引數，由於在javaweb中執行順序是listen——>filter——>servlet，在將請求傳遞給springmvc的前端控制器的時候，filter會先處理，其中下面的處理就是處理請求過來post的引數的亂碼問

jQuery繫結動態元素的點選事件無效

示例如下： <div> <ul id="demo"> <li>Kubernetes：下一代分散式系統的護戒使者</li> <li>機器學習工具--Pandas cheat sheet</li> <li&g

專案總結之 jquery中，使用append增加新元素時，新增元素的繫結監聽事件失效的解決辦法

$(“outerSelector”).on(“eventType”,“innerSelector”,function(){}); 舉例：如果在一個中，通過append新增一個id="demo"的按鈕，常用的直接$(“Selector”).on(“eventType”,function

JQuery繫結click事件的3種寫法

1.首先你得有jquery 1.7以上的版本的js 2.將js匯入專案 3.jsp原始碼 <%@ page language="java" contentType="text/html; ch

用jquery 繫結一個按鈕click事件後，第一次點選後，一切正常，第二次點選，竟然執行兩次，以後越來越多

用jquery 繫結一個按鈕click事件後，第一次點選後，一切正常，第二次點選，竟然執行兩次，以後越來越多。後來檢視文件發現 jquery click 不是替換原有的function 而是接著新增，所以才會執行次數越來越多。這有就可以在新增之前要先解除cli

處理jQuery append加入的元素繫結事件無效的方法

問題是：通過jQuery append（或者before、after，一樣）新新增進網頁的元素，常用的事件不能觸發，比如：append了id 為 abc 的元素，那麼 $(#abc).click(function(){})是沒有效果的。 1. 網上說要用live()函式，親

用jquery 繫結一個按鈕click事件後，第一次點選後，一切正常，第二次點選，竟然執行兩次，以後越來越多

用jquery 繫結一個按鈕click事件後，第一次點選後，一切正常，第二次點選，竟然執行兩次，以後越來越多，後來檢視文件發現 jquery click 不是替換原有的function 而是接著新增，所以才

jquery繫結事件並傳參例如click

因為要做這樣一個作業,就是兩個select中option相互轉換,圖如下: 這個作業就是給幾個按鈕新增click()事件,一般的用法是這樣的: 複製程式碼程式碼如下: $("#but_one").click(function(){ $("#select1 option:selected").append

jQuery繫結img的click事件

用JQUERY給IMGelement繫結click事件的時候，直接用img.click(function(){...})不起作用，如下面程式碼 $("img.ms-rteImage-LightBox").click(function(){ SP.UI.ModalDialog.showModalDialog(

js/jQuery繫結將來生成的事件

HTML <button class="num1">點選生成按鈕</button> <div class="newbtn" id="newparent" style="width: 400px;height: 80px;border: 1px solid r

jquery繫結事件 bind和on的區別

bind和on都是給元素繫結事件用的,其最大的區別就是事件冒泡事件冒泡也是委託事件的原型，事件委託就是子類的事情委託給父類的去做最直觀的區別就是on繫結比bind繫結多一個引數'childSelector' 語法 $(selector).on(event,childSelecto

JQuery繫結事件bind（）方法和on（）方法的優缺點

jQuery繫結事件的方法有四種：bing（）、live（）、delegate（）、on（），其中live（），已經被淘汰了，其存在很多的問題，不適合使用，而delegate能夠在繫結事件後，依然可以新增動態元素事件。on（）可以說是前三種方法的結合體。 1.bind（）方法： b

HTML中關於動態建立的標籤無法繫結js事件的解決方法

小夥伴們在前端頁面的時候，是不是會經常遇到用JavaScript動態創建出來的Button按鈕或其他標籤無法使用點選事件的問題。如下程式碼，使用jquery在body中動態建立一個class為demo的Button按鈕，當點選這個按鈕時無法觸發點選事件。 <script> $(fun

Jquery 繫結事件方式比較

兩個概念：靜態繫結：只適用於當前元素，不適應未來的元素（比如由指令碼建立的新元素）；動態繫結：適用於當前及未來的元素。 1、在DOM元素中直接繫結該方法支援動態繫結。例如：<input type="button" value="點我" o

JQuery - on繫結多個事件

一、jquery為多個選擇器繫結同一個事件 $("#start,#end").on("click",function(){ 　　　　alert("The paragraph was clicked."); }); 二、多個事件繫結同一個函式 $("p").on("mouseover

【前端】vue2.x 配合 bootstrapTable 動態新增元素和繫結點選事件，事件無效解決

背景：　　使用bootstrap-table 表格外掛時，每一行的最後一班會加操作按鈕列。如果不加入vue的話，使用外掛自己的列屬性formatter:function(value, row, index){}即可解決，動態拼接的html元素和對應的點選事件都可以正常使用。問題來了，在使用vue時，點選事

jquery繫結click等事件無效解決方法live替代$().click不執行

相關推薦