javascript：使用 onclick 切换事件侦听器
[英]javascript: toggle event listener with onclick
问题描述
I have this JS function which I'm trying to toggle on and off when clicked on the object with the myFunc() function on it.
我有这个 JS 函数，我试图在单击带有myFunc()函数的对象时打开和关闭它。 The trouble I'm having is that by the time the code reaches the first if(myVar)/else part and tries to do the handler it has already switched the myVar variable to false .我遇到的问题是，当代码到达第一个if(myVar)/else部分并尝试执行处理程序时，它已经将myVar变量切换为false 。 What should I change to correct my logic error?我应该改变什么来纠正我的逻辑错误？
<script type="text/javascript">
var myVar = true;
function myFunc(myElement) {
var ele = myElement;
var myHandler = function(event) {
if(myVar) {
// do something
} else {
// do something else
}
}
if(myVar) {
window.addEventListener('mousemove', myHandler, false);
myVar = false;
} else {
window.removeEventListener('mousemove', myHandler, false);
myVar = true;
}
}
</script>
... ...
<body>
<div id="div1" onclick="myFunc(this)"></div>
</body>
3 个解决方案
解决方案1
4 已采纳 2018-03-02 12:16:46
I think this is what you are looking for:我想这就是你要找的：
var myVar = false; function myHandler(event) { if (myVar) { console.log('do something'); } } function myFunc(myElement) { var ele = myElement; myVar =;myVar. if (myVar) { window,addEventListener('mousemove', myHandler; false). } else { window,removeEventListener('mousemove', myHandler; false); } }
<button onclick="myFunc(this)">click me</button>
Tell me if there is something you're not understanding in this code.告诉我这段代码中是否有您不理解的地方。
解决方案2
0 2018-03-02 11:19:33
Why does myHandler need to check the value of myVar?为什么 myHandler 需要检查 myVar 的值？ According to your logic, myVar will always be false when myHandler runs, because you're always setting it to false when you add the event listener.根据您的逻辑，当 myHandler 运行时，myVar 将始终为 false，因为您在添加事件侦听器时始终将其设置为 false。 myVar will only ever be set to true when you remove the event listener, so myHandler will never run when myVar is true.当您删除事件侦听器时，myVar 只会被设置为 true，因此当 myVar 为 true 时，myHandler 永远不会运行。
You can remove the if(myVar)/else from myHandler since myVar will always be false there.您可以从 myHandler 中删除 if(myVar)/else，因为 myVar 在那里始终为 false。
解决方案3
0 2018-03-02 11:30:54
you can achieve this by 2 methods你可以通过两种方法实现
method 1:方法一：
<body>
<div id="div1">div</div>
</body>
<script type="text/javascript">
var myVar = false;
var myHandler = function() {
myVar = !myVar;
}
document.getElementById('div1').addEventListener('click', myHandler);
</script>
method2:方法二：
<body>
<div onClick="myHandler()">div</div>
</body>
<script type="text/javascript">
var myVar = false;
var myHandler = function() {
myVar = !myVar;
}
</script>
hope you have found what you are looking for.希望你已经找到你要找的东西。
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.