jquery點選事件重複/疊加

阿新 • • 發佈：2019-01-21

原生JS新增點選事件無論新增多少次點選的時候都只會觸發一次

而用jquery新增繫結事件新增多少次點選的時候就觸發多少次如果想解決這個問題就在點選函式裡先用 $(物件).off("click") 取消上一次的點選事件

下面是程式碼展示

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>test</title>
</head>
<body>
    <button id="add">點選增加繫結事件</button>
    <button id="trigger">點我觸發繫結事件</button>
<script src="jquery-3.1.1.min.js"></script>
<script>
    var $add = $("#add"),
        $trigger = $("#trigger"),
        num = 0;
    $add.click(function() {
        $trigger.click(function() {
            num++;
            alert("第" + num + "次");
        });
    });    
</script>
</body>
</html>

jquery程式碼原始檔請自行下載

如上所示生成的頁面如果點選增加繫結事件3次然後點觸發就會連彈3次窗

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <title>test</title>
</head>
<body>
    <button id="add">點選增加繫結事件</button>
    <button id="trigger">點我觸發繫結事件</button>
<script>
    var add = document.getElementById("add"),
        trigger = document.getElementById("trigger"),
        num = 0;
    add.onclick = function() {
        trigger.onclick = function() {
            num++;
            alert("第" + num + "次");
        }
    } 
</script>
</body>
</html>

而用原生程式碼寫的增加點選事件則無論新增多少次觸發的時候都只會觸發一次彈窗

jquery點選事件重複/疊加

原生JS新增點選事件無論新增多少次點選的時候都只會觸發一次而用jquery新增繫結事件新增多少次點選的時候就觸發多少次如果想解決這個問題就在點選函式裡先用 $(物件).off("click") 取消上一次的點選事件下面是程式碼展示<!DOCTYPE html

JQuery點選事件回到頁面頂部效果

//2個div，點選某個時回到頂部 <div style="height:1000px">111111111111111</div> <div id="top" >top</div> <引用JQuery> <

Jquery點選事件只觸發一次的解決方法

方案一： <script> $(function () { $("#all").click(function(){ if(this.checked){ $("#list :checkbox").attr

關於jquery中的點選事件，每點一次執行的效果就疊加一次，click是新增點選事件的意思

我本人還是前端的菜鳥，所以一般在寫特效的時候，喜歡用jquery，但是在用jquery的點選事件中，點選後改變容器中的內容，但是發現每點一次就顯示一個內容，點幾次就有幾個。jquery中的點選事件，每點一次執行的效果就疊加一次，click是新增點選事件的意思。那麼來解決這

jquery定義之後的按鈕點選事件，會產生累計的情況

使用jquery的on()方法為元素綁定了點選事件，點選同時傳送請求。完成後看效果，第一次點選沒有問題。再一次點選後發現傳送了兩次請求，後面再點擊發現請求的數量越來越多。當排查之後，發現只有一個元素綁定了事件，而且只調用了一次之後，得出最有可能的一種情況，就是點選事件被累加綁定了。 $("#ad

jquery中一個點選事件累計觸發問題詳解。

最近維護老的公司專案，jquery中事件累計觸發的bug是一個老生長談的問題，因此想要弄清楚就必須先弄清楚addEventListener和onclick系列方法的區別 W3C上原文如下 addEventListener is the way to register

解決 jQuery 動態新增節點無法觸發 onclick 點選事件的問題

問題：當我們在網頁載入完成後，使用 JQuery 給頁面動態增加增加節點時，會發現新增節點無法觸發點選事件處理：使用 live() 或 on() 方法給新增節點新增點選事件！

jquery的點選事件，非動態載入點選與動態載入點選

jquery的點選事件，非動態載入點選與動態載入點選寫法不同 1.非動態載入點選 <div id="clickdemo"> <ul> <li>1<li> </ul> </div>點選1觸發 $

jquery父元素和子元素點選事件傳遞問題_不可把父元素的事件傳遞給子元素_事件無限迴圈傳遞

前述：jquery中：當一個元素的點選事件被觸發時，會自動將該事件向父級元素逐級專遞。但是實際場景當中，我們可能會遇到需要在父級元素中定義點選事件，來觸發特定子元素的點選事件，我就遇到了這麼一個問題。但是這麼做的後果，在jquery1.8.2版本及以後所有版本（截止目前最新版本為3.3），

jQuery動態append新增元素點選事件失效

最近開始做前端，遇到一些問題，現在記錄一下，以備不時之需。問題描述：在div中動態新增span元素，之後執行 $(selector).click(function(){var param = $(this).text();}) 無法觸發事件。原因：append中的節點是在整個文件

jquery 商品評論星星點選事件

五角星可以在iconfont.cn上面找，名字分別為：五角星（滿）、五角星（空）  代表空星星  代表實心星星 html 程式碼 <div class="start_box"> <i cl

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

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

攔截滑鼠頻繁重複點選事件

1.頻繁重複點選只執行最後一次點選事件 /** * 頻繁重複點選只執行最後一次點選事件 * @param {ObjectElement} el 元素物件 * @param {Functio

jquery 點選隱藏按鈕的模仿事件

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </he

JQuery自動點選事件載入事件

JQuery自動載入整個TXT檔案 $(document).ready(function(){ $("button").trigger("click")//自動實現點選 $("#div1").load("/try/aj

jQuery 為動態追加的元素新增點選事件

在 jquery1.7 之前的版本中用的是 live()方法,但是 live() 方法在 1.7 中已經不建議使用,1.9 中已經刪除了這個方法. live() 方法適用於匹配選擇器的當前及未來的元素 (例如用 JS 指令碼建立的新元素）自 jquery1.7 版本起，on() 方法是

JQuery各種點選事件的區別

在工作中，經常用到js的點選事件，有好多種表現形式，今天抽空總結一下它們的區別與聯絡。廢話不多說，開始寫測試案例。首先宣告，本人水平有限，如果有錯誤之處，還請指正。一、.點選事件，用到的有 1:$(".J_edit_save").on('click',function(

jQuery 中trigger()方法使用 -- 複製元素點選事件

1. 常用事件在頁面載入完成時自動觸發input的點選事件，在移動端可以實現自動彈出輸入法，獲得焦點 $("input").trigger("click").focus(); 簡寫為以下： $("input").click(); 2. 自定義事件

jquery中click點選事件巢狀後多次觸發的解決方案

首先講講我遇到這個問題的時候，我最開始想到的是阻止事件冒泡，想了一下好像沒有什麼關係的，最後決定還是動手做做看，放到專案中試了試確實是沒有什麼關係的，傻眼了怎麼辦，來講講我的親身體驗吧！產生此種小姑的原因：jQuery中的click事件會累計繫結，所以我們可以在下次點

jQuery移除或禁用html元素的點選事件

移除或禁用html元素的點選事件可以通過css實現也可以通過js或jQuery實現。一、CSS方法 .disabled { pointer-events: none; }二、jQuery方法方法

jquery點選事件重複/疊加

相關推薦