JQuery live()用法及代碼示例

此方法用於為所選元素附加一個或多個事件處理程序。它還指定事件發生時運行的函數。所使用的事件處理程序將對與選擇器匹配的當前和將來元素均起作用。

用法:

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

參數：

Event: 它用於指定事件，這些事件將附加到元素上。如果有多個事件，則它們之間用空格隔開。
Function: 它用於指定事件發生時將運行的函數。
data: 它用於通過該函數指定其他數據傳遞。這是一個可選屬性。

示例1：事件發生時顯示和隱藏文本。

<!DOCTYPE html> 
<html> 
  
<head> 
    <script src= 
"https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"> 
    </script> 
    <script> 
        $(document).ready(function() { 
            $("button").live("click", function() { 
                $("p").slideToggle(); 
            }); 
        }); 
    </script> 
</head> 
  
<body> 
  
    <p>Geeks for Geeks</p> 
  
    <button>Press</button> 
    <br> 
    <br> 
  
    <div><b><h4>Clicking on the 'Press'  
      button will execute the live method(). 
      </h4></b> </div> 
</body> 
  
</html>

輸出：

在單擊按鈕之前：

單擊按鈕後：

示例2：插入元素並在事件發生時隱藏。

<!DOCTYPE html> 
<html> 
  
<body> 
    <h1><center>Geeks 
      </center> 
  </h1> 
    <script src= 
"https://ajax.googleapis.com/ajax/libs/jquery/1.7/jquery.min.js"> 
    </script> 
    <script> 
        $(document).ready(function() { 
            
            $("p").live("click", function() { 
                $(this).slideToggle(); 
            }); 
            $("button").click(function() { 
                $("<p>Inserted Element</p>").insertAfter( 
                  "button"); 
            }); 
        }); 
    </script> 
    <p>Click here to make it disappear.</p> 
    <button>Click to insert an element</button> 
  
</body> 
  
</html>

輸出：

原來：

在單擊按鈕之前：

單擊按鈕後：

相關用法

注：本文由純淨天空篩選整理自riarawal99大神的英文原創作品 jQuery | live() Method。非經特殊聲明，原始代碼版權歸原作者所有，本譯文未經允許或授權，請勿轉載或複製。