資料結構
網路
關係型資料庫管理系統
作業系統
Java
MS Excel
iOS
HTML
CSS
Android
Python
C 語言程式設計
C++
C#
MongoDB
MySQL
Javascript
PHP
物理學
化學
生物學
數學
英語
經濟學
心理學
社會學
時尚研究
法律研究jQuery.click() 與 onClick 的區別
在本文中，我們將學習 jQuery.click() 和 onClick 之間的區別。讓我們首先了解 jQuery 中的 click() 和 onClick() 是什麼。
jQuery click()
示例
click() 方法觸發每個匹配元素的點選事件。讓我們看一個例子：
<html>
<head>
<title>The jQuery click() Example</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
<script language = "javascript">
$(document).ready(function() {
$("#clickButton1").click(function(){
alert("click event occurred");
});
});
function clickFirstButton(){
$("#clickButton1").click();
}
</script>
</head>
<body>
<form name = "sampleForm">
<label>Enter Name: </label><input type = "text" id = "result1" title="Enter Name" value = "" ></input><br/><br/>
<input type = "button" id = "clickButton1" value = "Click Me!" /> <input type = "button" id = "clickButton2" value = "Click First Button!" onclick="clickFirstButton();" />
</form>
</body>
</html>
輸出
點選點選我按鈕 &mius;
點選點選第一個按鈕按鈕：
onClick
當用戶點選滑鼠左鍵時，會發生 onclick() 事件型別。您可以針對此事件型別放置您的驗證、警告等。
示例
讓我們看一個例子：
<!DOCTYPE html>
<html>
<head>
<script>
function myAttrFunc() {
var a = document.getElementsByTagName("a")[0].getAttribute("href");
document.getElementById("Demo").innerHTML = a;
}
</script>
</head>
<body>
<h1>Courses</h1>
<a href="https://tutorialspoint.tw/market/index.asp">Tutorialspoint Courses</a>
<p>Clicking the below button to get the above link:</p>
<button onclick="myAttrFunc()">GET THE LINK</button>
<p id="Demo"></p>
</body>
</html>
輸出
點選獲取連結按鈕以顯示連結：
使用 click() 更好，因為它遵循標準的事件註冊模型。您可以將多個處理程式附加到同一個元素。您可以輕鬆訪問事件物件，並且處理程式可以位於任何函式的範圍內。此外，它是動態的，即它可以隨時呼叫，並且特別適合於動態生成的元素。無論您使用 jQuery、其他庫還是直接使用原生方法，實際上都沒有關係。
更新於: 2022年12月6日
8K+ 瀏覽量
廣告