1

我只是一个初学者编码器，所以也许这个问题会让你微笑，但我找不到任何解决方案。

我有一个链接：

 <div class="comments"><a href="#" onclick="get_comments('.$row['post_id'].')">'.$comments_no.' comments</a></div>

哪个点击触发了一个功能：

 function get_comments(id) {
 x = "#cf"+id;
 y = "#comments"+id;
 $(x).toggle(100);
 var dataString = id;
 $(".loading").ajaxStart(function () {
 $(this).show();
 });
 $(".loading").ajaxStop(function () {
 $(this).hide();
 });

 $.ajax({
 type: 'POST',
 url: 'load_comments.php',
 data: {'dataString':dataString},
 cache: false,

 success: function(data){
 $(y).html(data);
 }
 });
 return false;    
 };

一切正常，直到我真正点击一个链接......每次我点击一个链接，它都会把我带到页面的顶部。谁能告诉我如何解决这个问题？

4

5 回答 5

2

可以使用href="#"，但我没有看到您的 preventDefault 功能。

尝试这个：

HTML：

<div class="comments">
    <a href="#" class="comments-click" data-id="'.$row['post_id'].'">'.$comments_no.' comments</a>
</div>

JS：

$(document).ready(function() {
    $('.comments-click').click(function(event) {
        event.preventDefault(event);
        id = $(this).data('id');
        /* ... */
    });
});

与.data()您可以访问data-*属性。

如果您有.click()比 更好的事件处理程序onclick，则传递事件（单击“#”）并阻止它！

JSFiddle：http: //jsfiddle.net/aCLyw/2/

http://api.jquery.com/event.preventDefault/

（抱歉对答案进行了 1000 次编辑）

于 2013-08-24T11:41:19.183 回答
1

您需要从事件处理程序返回 false

<div class="comments"><a href="#" onclick="return get_comments('.$row['post_id'].')">'.$comments_no.' comments</a></div>
于 2013-08-24T11:18:11.930 回答
0

当使用（或滥用）A-Tag 作为 JavaScript 按钮时，您有两个选项来阻止默认行为（即跟随链接）：

javascript: 无效 0

而不是设置href="#"，使用它来完成工作并返回undefined，例如：href="javascript: void(get_comments('.$row['post_id'].'))". 有关更多信息，请参阅此答案void。

event.preventDefault

更好的方法是将 HTML 和 JavaScript 分开（请参阅Unobtrusive JavaScript）并使用事件处理程序。在您的 JS 中，您可以简单地向 DOM-Element 添加一个处理程序

<a id="commentsLink" data-id=".$row['post_id']." href="#">comments</a>

经过

var commentsLink = document. getElementById("commentsLink");
commentsLink.addEventListener("click", function(event) {
  var postId = event.target.getAttribute("data-id");
  // your code
  event.preventDefault();
}
于 2013-09-25T07:52:47.673 回答
0

试试这个，它会工作

 <div class="comments"><a href="Javascript:void(0)" 
  onclick="get_comments('.$row['post_id'].')">'.$comments_no.' comments</a></div>
于 2013-08-24T11:44:59.077 回答
0

这导致了这种行为：href="#"

所以如果你不想要它，你可以在href中调用一个javascript函数，或者不使用这个属性，那么你必须设计你的锚看起来像一个链接。

href="#"表示转到页面顶部。您可以使用其他引用： href="#foo"这意味着<hr>使用 id foo 跳转。

可能的解决方案：

<a href="javascript:get_comments('.$row['post_id'].')">

或者

<a onclick="get_comments('.$row['post_id'].')" class="mylink">

如果您删除 href，它看起来就不会像 .mylink 类那样样式的链接。

于 2013-08-24T11:26:22.323 回答