jQuery：捕获锚点href onclick并异步提交
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/12648916/
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: Capture anchor href onclick and submit asynchronously
提问by mOrloff
I almost never get to play with client-side stuff, and this presumably simple task is kicking my butt :)
我几乎从来没有玩过客户端的东西，这个大概很简单的任务就是踢我的屁股:)
I have some links. OnClick I want to prevent the default action, capture its href url, submit an ajax GET to that url, and simply alert()with the results ... but I can't even get past the starting line :)
我有一些链接。OnClick 我想阻止默认操作，捕获其 href url，向该 url 提交一个 ajax GET，然后简单地alert()使用结果......但我什至无法越过起跑线:)
Example anchors for play-time:
播放时间的示例锚点：
<a class="asynch_link" href="good/1.html">Click Here</a>
<a class="asynch_link" href="good/2.html">Click Here</a>
Now, I've played with a few suggestions for similarrequests on SO, but the links still cause the browser to navigate to the href url.
现在，我已经对 SO 上的类似请求提出了一些建议，但这些链接仍然会导致浏览器导航到 href url。
Even with just
即使只是
<script type="text/javascript">
$('a').click(function (event)
{
event.preventDefault();
//here you can also do all sort of things
});
</script>
...the links still navigate to the other page.
...链接仍然导航到另一个页面。
I'm kinda feeling like and infant here :)
我有点像这里的婴儿:)
Any and all help will be deeply appreciated.
任何和所有帮助将不胜感激。
And, yes, I AMincluding jQuery :)<script src="//67.20.99.206/javascripts/jqueryCountdown/1-5-11/jquery.countdown.js" type="text/javascript" charset="utf-8"></script>
而且，是的，我AM包括jQuery的:)<script src="//67.20.99.206/javascripts/jqueryCountdown/1-5-11/jquery.countdown.js" type="text/javascript" charset="utf-8"></script>
回答by mOrloff
$('a').click(function(event) {
event.preventDefault();
$.ajax({
url: $(this).attr('href'),
success: function(response) {
alert(response);
}
});
return false; // for good measure
});
回答by codingbiz
Try this
尝试这个
$('a').click(function (event)
{
event.preventDefault();
var url = $(this).attr('href');
$.get(url, function(data) {
alert(data);
});
});
回答by Sushanth --
The problem here is that the Events are not being attachedto your element because they are not being bound in DOM ready event . Try including your events in DOM ready event and if it works you will see the alert
这里的问题是事件没有附加到您的元素，因为它们没有绑定在 DOM 就绪事件中。尝试将您的事件包含在 DOM 就绪事件中，如果有效，您将看到警报
<script>
$(function() {
$('a').click(function(event) {
event.preventDefault();
alert('fff')
//here you can also do all sort of things
});
});
</script>
After this send the Ajax request and submit the form in the Success callback function..
在此之后发送 Ajax 请求并在 Success 回调函数中提交表单..
<script>
$(function() {
$('a').click(function(event) {
event.preventDefault();
$.ajax({
url: 'url',
dataType :'json',
data : '{}',
success : function(data){
// Your Code here
$('#form').submit();
}
})
});
});
</script>
