使用“link_to”时遇到问题和 jQuery
我正在使用 Ruby on Rails 3.0.7 和 jQuery 1.6.1，并将 AJAX 单击事件绑定到 link_to HTML 输出，如以下示例所示：
link_to 'Link name', '#', :id => 'link_css_id'
如您所见，我将 URL 设置为 ' #'。这样做，当我单击链接时，当前视图也将移动到页面顶部。由于我不喜欢这种行为，因此我没有为 URL 参数设置任何内容（即 nil 或 ''），但单击链接时我会收到警报消息“错误”立即消失。然后在 Firebug 控制台中我得到：
uncaught exception: [Exception... "prompt aborted by user" nsresult: "0x80040111 (NS_ERROR_NOT_AVAILABLE)" location: "JS frame :: resource://gre/components/nsPrompter.js :: openTabPrompt :: line 468" data: no]
如何解决此问题并避免单击链接时出现在页面顶部的行为？
AJAX 请求是：
$jQ('#link_css_id').bind('click', function() {
$jQ.ajax({
type: "POST",
url: "<%= user_url(@current_user)%>/test_method",
data: "test_data=test",
error: function(jqXHR, textStatus, errorThrown) {
alert(textStatus + ' - ' + errorThrown + '\n\n' + jqXHR.responseText);
$jQ('#css_id').html('error')
},
success: function(data, textStatus, jqXHR) {
$jQ('#css_id').html('success')
}
});
});
I am using Ruby on Rails 3.0.7 and jQuery 1.6.1 and I am binding an AJAX click event to a link_to HTML output as in the following example:
link_to 'Link name', '#', :id => 'link_css_id'
As you can see I set the URL to '#'. Doing that when I click on the link the current view will be moved at the top of the page, as well. Since I don't like this behaviour, I set nothing (that is, nil or '') for the URL parameter, but on clicking on the link I get an alert message "error" that immediately after disappear. Then in the Firebug Console I get:
uncaught exception: [Exception... "prompt aborted by user" nsresult: "0x80040111 (NS_ERROR_NOT_AVAILABLE)" location: "JS frame :: resource://gre/components/nsPrompter.js :: openTabPrompt :: line 468" data: no]
How can I solve this issue and avoid the behavior of going at the top of the page on clicking the link?
The AJAX request is:
$jQ('#link_css_id').bind('click', function() {
$jQ.ajax({
type: "POST",
url: "<%= user_url(@current_user)%>/test_method",
data: "test_data=test",
error: function(jqXHR, textStatus, errorThrown) {
alert(textStatus + ' - ' + errorThrown + '\n\n' + jqXHR.responseText);
$jQ('#css_id').html('error')
},
success: function(data, textStatus, jqXHR) {
$jQ('#css_id').html('success')
}
});
});
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（3）
url“#”表示正在设置内部锚点。它没有附加任何名称，它只是聚焦于整个页面，然后向上滚动回到顶部。
对于使用
link_to方法，url属性是必需的，不能省略。对于 jquery，您可以使用
preventDefault。这将阻止事件的默认操作（例如，单击链接将打开hrefurl）。这非常有用。您可能希望为未启用 javascript 的用户（以及 ajax 调用不起作用）链接到现有页面，而启用 javascript 的用户会忽略该页面。jQuery 的 preventDefault 文档。
The url "#" means an internal anchor is being set. With no name attached to it, it simply focuses on the whole page, and scrolls back up to the top.
As for using the
link_tomethod, theurlattribute is required and cannot be omitted.With jquery, you can use
preventDefault. This will prevent the default action from the event (e.g.., clicking on a link will open thehrefurl). This is quite useful. You might want to link to an existing page for users that do not have javascript enabled (and where the ajax call won't work), while it is being ignored by those who do have javascript.preventDefault documentation by jQuery.
你可以设置
javascript:void(0)而不是#它对我有帮助。you can set
javascript:void(0)instead of#it help me.保留
#，并使用preventDefault阻止默认单击事件移动窗口。http://api.jquery.com/event.preventDefault/
Keep the
#, and usepreventDefaultto stop the default click event from moving the window.http://api.jquery.com/event.preventDefault/