jQuery - 如何使用 e.preventDefault(); 在 JavaScript 函数中
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5168528/
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
jQuery - How to use e.preventDefault(); in a JavaScript function
提问by markzzz
I have this JavaScript function :
我有这个 JavaScript 函数：
function putVote(trackid, vote) {
}
and I call this function trought :
我把这个函数称为 trought ：
<a href="#" onClick="putVote('data1', 'data2')">Link</a>
I would like to use e.preventDefault();on putVote(), but I think I'm wrong in some ways. How can I do it?
我想使用e.preventDefault();on putVote()，但我认为我在某些方面是错误的。我该怎么做？
Cheers
干杯
回答by Skilldrick
The simplest thing to do would be to return falsefrom the functionin the handler (return falsewould only work in putVoteif the handler had return putVote('data1', 'data2)).
要做的最简单的事情是return false从处理程序中的函数（return false只有在putVote处理程序有 时才能工作return putVote('data1', 'data2)）。
But as Pointy said, a much better technique is to attach the event handler from JavaScript, most easily achieved by using a library/framework such as jQuery or Prototype.
但正如 Pointy 所说，更好的技术是从 JavaScript 附加事件处理程序，最容易通过使用库/框架（例如 jQuery 或 Prototype）来实现。
回答by Chris Van Opstal
The easiest way:
最简单的方法：
<a href="#" onClick="putVote('data1', 'data2'); return false;">Link</a>
回答by kim3er
If you're using jQuery.
如果您使用 jQuery。
JS:
JS：
$("#link").click(function(evt) {
evt.preventDefault();
putVote('data1', 'data2');
});
HTML:
HTML：
<a href="#" id="link">Link</a>
If you're using the latest version of jQuery and the HTML5 doctype.
如果您使用的是最新版本的 jQuery 和 HTML5 文档类型。
JS:
JS：
$("#link").click(function(evt) {
evt.preventDefault();
var $self = $(this);
putVote($self.data("one"), $self.data("two"));
});
HTML:
HTML：
<a href="#" id="link" data-one="data1" data-two="data2">Link</a>
回答by Pointy
In your case, the trick with using jQuery-style binding is that you want to be able to pass through element-specific parameters to the handler ("data1", "data2"). The "modern" way to do that would be this:
在您的情况下，使用 jQuery 样式绑定的技巧是您希望能够将特定于元素的参数传递给处理程序（“data1”、“data2”）。做到这一点的“现代”方式是这样的：
<a href="#" class='data-clickable' data-click-params='["data1", "data2"]'>Link</a>
Then, in a "ready" handler (or some other appropriate place), you'd bind your handler:
然后，在“就绪”处理程序（或其他适当的地方）中，您将绑定您的处理程序：
$('a.data-clickable').click(function(e) {
var elementData = $(this).data('click-params');
//
// ... handle the click ...
//
e.preventDefault();
});
The "elementData" variable will end up (in this case, anyway) being an array with two values in it, "data1" and "data2". You can give JSON-notation values to "data-foo" attributes, and when you fetch the attributes with the jQuery ".data()" method it will automatically decode the JSON for you.
“elementData”变量最终（在这种情况下，无论如何）是一个数组，其中包含两个值，“data1”和“data2”。您可以为“data-foo”属性提供 JSON 符号值，当您使用 jQuery“.data()”方法获取属性时，它会自动为您解码 JSON。
