时间戳

首页 > 解决方案 > jQuery点击功能阻止ajax请求

jquery - jQuery点击功能阻止ajax请求

问题描述

我有一个简单的编辑按钮，应该发出 AJAX 请求。当您单击此按钮时，我有一个 JQuery 函数，它也应该将窗口向上滚动到表单。

问题是 JQuery 函数有效，但从未进行 AJAX 调用。我知道函数是问题所在，因为如果我将其注释掉，就会发出 AJAX 请求。

<div class="panel-footer clearfix">
  <%= link_to 'Edit', user_movie_edit_review_path(review.user, review.movie,review), method: :patch, remote: true, class: 'review-edit btn btn-primary btn-xs pull-left' %>
  <div class="col-sm-1"><i class="fa fa-facebook-official fa-2x"></i></div>
  <div class="col-sm-1"><i class="fa fa-twitter-square fa-2x"></i></div>
  <div class="col-sm-1"><i class="fa fa-google-plus fa-2x"></i></div>
</div>

<script>
    $(document).ready(function(){ 
        $(".review-edit").click(function(e){
            $('html, body').animate({scrollTop : 0},500);
            return false;
        });
    });
</script>

标签： jqueryruby-on-railsajax

解决方案

您是否尝试使用 e.preventDefault()？

$(".review-edit").click(function(e){
  e.preventDefault()
  $('html, body').animate({scrollTop : 0},500); 
});

or
$(".review-edit").on("click", function(e) {
  e.preventDefault();
  $('html, body').animate({scrollTop : 0},500);
})

或超出 ready() 函数...我认为这是最好的解决方案

$(document).ready(function(){...})
$(document).on("click", ".review-edit", function(e) {
  e.preventDefault();
  $('html, body').animate({scrollTop : 0},500);
})

推荐阅读