jQuery 我应该如何调用我的 javascript。href、onclick 还是绑定 click 事件?
声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow
原文地址: http://stackoverflow.com/questions/10189726/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
How should i call my javascript. href, onclick or bind the click event?
提问by ThdK
I know there are already a lot of articles about this concept but my question has a little difference.
我知道已经有很多关于这个概念的文章,但我的问题有点不同。
On my page, I have a link:
在我的页面上,我有一个链接:
<a id="mylink">click me </a>
Then I'm changing the href dynamically using:
然后我使用以下方法动态更改 href:
$get('mylink').href = 'javascript:doSomething(id);';
It happens I have to call the above code multiple times so i overwrite the current value of the href attribute with javascript code calling the same function with different id parameter.
碰巧我必须多次调用上面的代码,所以我用 JavaScript 代码覆盖了 href 属性的当前值,并使用不同的 id 参数调用了相同的函数。
The above is what i'm using for a long time now. But the mess started some sime ago when i'm trying to implement OnNavigateAway to warn the user when he closes the browser window. IE will also trigger this onNavigateAway event when the user clicks a anchor with a value for the href attribute.
以上是我长期使用的。但是,当我尝试实现 OnNavigateAway 以在用户关闭浏览器窗口时警告用户时,混乱就开始了。当用户单击带有 href 属性值的锚点时,IE 也会触发此 onNavigateAway 事件。
So I started to replace those href's with jquery click events:
所以我开始用 jquery 点击事件替换这些 href 的:
$("#mylink").click(function (e) {
doSomething(id);
e.preventDefault();
});
But remember that this code can be called multiple times, so i have to unbind the click event first and then bind again:
但请记住,这段代码可以被多次调用,所以我必须先解除点击事件的绑定,然后再次绑定:
function completed(result) {
$("#mylink").unbind('click');
$("#mylink").click(function (e) {
doSomething(result.id);
e.preventDefault();
});
}
Is this a good way to handle my javascript? Or is this binding and unbind stuff no good practice?
这是处理我的 javascript 的好方法吗?或者这种绑定和解除绑定的东西不是好的做法吗?
Another way to do this can be to overwrite the onclick attribute manually with javascript.
另一种方法是使用 javascript 手动覆盖 onclick 属性。
How would you handle this?
你会如何处理这件事?
I'm looking forward to your response.
我期待着你的回应。
回答by Shadow Wizard is Ear For You
I would use different logic here. Instead of reassigning the click event, I will just change some data property then in the "global" click event use this property:
我会在这里使用不同的逻辑。我不会重新分配点击事件,而是更改一些数据属性,然后在“全局”点击事件中使用此属性:
$("#mylink").on("click", function (e) {
doSomething($(this).data("id"));
e.preventDefault();
});
Then when you need to change that id
have such code:
然后当您需要更改id
具有这样的代码时:
$("#mylink").data("id", id);
This way repeated calls to change the data will cause only the last to affect e.g.
这样重复调用更改数据只会导致最后一个影响例如
$("#mylink").data("id", 5);
$("#mylink").data("id", 6);
$("#mylink").data("id", 7);
When clicked, 7 will be passed to the function.
单击时,7 将传递给该函数。
In case the element is created dynamically and assuming you're using jQuery 1.7 or above you can use the .on
to catch even those dynamically created elements:
如果元素是动态创建的,并且假设您使用的是 jQuery 1.7 或更高版本,您.on
甚至可以使用来捕获那些动态创建的元素:
$("body").on("click", "#mylink", function (e) {
doSomething($(this).data("id"));
e.preventDefault();
});