我正在使用 JQuery 的 .click 函数，并且我的网站上有多个按钮。单击一个按钮将执行 HTML 文档中的每个 .click 函数。有没有办法让一个按钮执行一次.click？我在下面添加了一些代码来说明我的问题。单击第一个按钮“Click Me!”将执行我的 HTML 文档中的所有函数。我该如何制作按钮“Click Me!”不执行我文档中的每个函数？
<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<title>
My Website
</title>
<meta http-equiv="Content-Type"
content="text/html; charset=UTF-8">
</head>
<body>
<button>
Click Me!
</button>
<button onclick="document.body.style.backgroundColor='blue';">
Change BG color
</button>
<script>
$(document).ready(function () {
$("button").click(function(){
$("#d").hide();
});
});
$(document).ready(function () {
$("button").click(function(){
$("#f").fadeToggle(3000);
});
});
</script>
<button>Toggle fade</button>
<div>
<p id="d">Some text here.</p>
</div>
<div>
<p id="f">Some text to fade.</p>
</div>
</body>
</html>
*更新 所以我将脚本更改为以下内容:
$(document).ready(function () {
$('#button1').click(function(){
$("#d").hide();
});
});
但是当我点击按钮时什么也没有发生。这是正确的语法吗？此语法用于 W3Schools。
最佳答案
如果您使用$("button")，您提供的click()函数将应用于所有按钮。我建议给你的按钮一个 id，然后使用:
$("#myButtonId").click(function(){
$("#d").hide();
});
JQuery selectors对于定位 DOM 中的元素非常有用。
关于javascript - 单击不同按钮时如何分离函数执行，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/26554309/