每次点击都会将其功能的性能提高到1
每次点击都会将其功能的性能提高到1
提问于 2013-06-21 23:09:07
当我每次点击按钮时，函数再次运行。为什么？
我必须点击两次，但我不会只点击一次。
在google chrome中试试这段代码。
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<div id="one" >   Srboljub Petrovic</div>
<input type="button" id="f" value="Klikni" onclick="f1();"></input>
<script>
function f1()
{
$("#f").click(function()
{
$("#one").slideUp();
$("#one").css("border", "5px solid gray");
$("#one").css("background-color", "red");
$("#one").css("color","white");
$("#one").slideDown();
});
}
</script>
</body>
</html>回答 3
Stack Overflow用户
回答已采纳
发布于 2013-06-21 23:12:38
您在单击处理程序中绑定了一个单击处理程序，因此每次单击按钮时，都会绑定一个新的单击事件处理程序，并且它会不断增加。
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
$(function() {
$("#f").on('click', function() {
$("#one").slideUp(function() {
$(this).css({border : "5px solid gray",
backgroundColor: "red",
color : "white"})
.slideDown();
});
});
});
</script>
</head>
<body>
<div id="one">  Srboljub Petrovic</div>
<input type="button" id="f" value="Klikni" />
</body>
</html>注意，输入元素没有结束标记，并且jQuery方法是可链接的。
此外，要在元素向下滑动后向上滑动，请使用回调。
Stack Overflow用户
发布于 2013-06-21 23:12:45
之所以会发生这种情况，是因为您既在HTML中分配了单击处理程序，又在每次调用时在f1中分配了另一个处理程序。如果您使用Javascript分配事件处理程序，则不应在HTML中也分配它们：
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
</head>
<body>
<div id="one" >   Srboljub Petrovic</div>
<input type="button" id="f" value="Klikni"></input>
<script>
$("#f").click(function(){
$("#one").slideUp();
$("#one").css("border", "5px solid gray");
$("#one").css("background-color", "red");
$("#one").css("color","white");
$("#one").slideDown();
});
</script>
</body>
</html>Stack Overflow用户
发布于 2013-06-21 23:13:18
在绑定click函数之前，请确保将其解除绑定。
function f1()
{
$("#f").unbind("click").click(function()
{
//code
});
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/17245563
复制
![3d游戏建模全解[通俗易懂]](https://ask.qcloudimg.com/http-save/yehe-8223537/7bb05eb4ebb59c6c4b6b750fd14a92b6.png)
相似问题
Java 3D游戏编程
3d游戏编程的模型？
C语言的游戏编程，从哪里开始呢？
C#中的游戏编程-从哪里开始？
开始iphone 3d游戏编程
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
