POST 不应重新加载页面

Question

我有一个问题，我实现了一个代码，以便在悬停时添加文章的数据库 ID 以使文章成为已读，并且下面的代码每次都会更新页面 有我的代码（添加的数据类型）

$('.newness').hover(
    function () {
        $(this).addClass('hover');
       newnessId = $(this).data('id');
       $.ajax({url:'/user_activities', method: 'POST', data: {user_activity:{activity_id: newnessId}},
           dataType: "script"
       })
    }
)

我认为问题是'POST'他刷新页面...... 也许解决方案是堆叠所有ajax请求并稍后执行'post'，但我不知道该怎么做， 对不起我的英语不好

有日志：

Started POST "/user_activities.json" for 127.0.0.1 at 2018-05-25 14:31:49 +0200
Processing by UserActivitiesController#create as JSON
  Parameters: {"user_activity"=>{"activity_id"=>"3"}}
  User Load (1.6ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 ORDER BY "users"."id" ASC LIMIT $2  [["id", 2], ["LIMIT", 1]]
  ↳ /home/benjamin/.rbenv/versions/2.5.0/lib/ruby/gems/2.5.0/gems/activerecord-5.2.0.rc1/lib/active_record/log_subscriber.rb:98
   (0.4ms)  BEGIN
  ↳ app/controllers/user_activities_controller.rb:12
  Activity Load (0.3ms)  SELECT  "activities".* FROM "activities" WHERE "activities"."id" = $1 LIMIT $2  [["id", 3], ["LIMIT", 1]]
  ↳ app/controllers/user_activities_controller.rb:12
  UserActivity Exists (0.4ms)  SELECT  1 AS one FROM "user_activities" WHERE "user_activities"."user_id" = $1 AND "user_activities"."activity_id" = $2 LIMIT $3  [["user_id", 2], ["activity_id", 3], ["LIMIT", 1]]
  ↳ app/controllers/user_activities_controller.rb:12
Started POST "/user_activities.json" for 127.0.0.1 at 2018-05-25 14:31:49 +0200
  UserActivity Create (6.7ms)  INSERT INTO "user_activities" ("activity_id", "user_id", "created_at", "updated_at") VALUES ($1, $2, $3, $4) RETURNING "id"  [["activity_id", 3], ["user_id", 2], ["created_at", "2018-05-25 12:31:49.932177"], ["updated_at", "2018-05-25 12:31:49.932177"]]
Processing by UserActivitiesController#create as JSON
  ↳ app/controllers/user_activities_controller.rb:12
  Parameters: {"user_activity"=>{"activity_id"=>"3"}}
   (2.5ms)  COMMIT
  ↳ app/controllers/user_activities_controller.rb:12
Redirected to http://localhost:3000/
Completed 200 OK in 26ms (ActiveRecord: 11.9ms)


  User Load (2.9ms)  SELECT  "users".* FROM "users" WHERE "users"."id" = $1 ORDER BY "users"."id" ASC LIMIT $2  [["id", 2], ["LIMIT", 1]]
  ↳ /home/benjamin/.rbenv/versions/2.5.0/lib/ruby/gems/2.5.0/gems/activerecord-5.2.0.rc1/lib/active_record/log_subscriber.rb:98
   (0.7ms)  BEGIN
  ↳ app/controllers/user_activities_controller.rb:12
  Activity Load (0.6ms)  SELECT  "activities".* FROM "activities" WHERE "activities"."id" = $1 LIMIT $2  [["id", 3], ["LIMIT", 1]]
  ↳ app/controllers/user_activities_controller.rb:12
  UserActivity Exists (0.9ms)  SELECT  1 AS one FROM "user_activities" WHERE "user_activities"."user_id" = $1 AND "user_activities"."activity_id" = $2 LIMIT $3  [["user_id", 2], ["activity_id", 3], ["LIMIT", 1]]
  ↳ app/controllers/user_activities_controller.rb:12
   (0.3ms)  ROLLBACK
  ↳ app/controllers/user_activities_controller.rb:12
Redirected to http://localhost:3000/
Completed 200 OK in 19ms (ActiveRecord: 5.7ms)


Started GET "/" for 127.0.0.1 at 2018-05-25 14:31:49 +0200
Processing by PagesController#home as HTML

ROLLBACK 是因为我在我的模型中提到了 uniqness :) 应用程序在发布后开始获取/，因此页面刷新到/我不知道为什么

谢谢:)

Answer 1

您是否忘记在 ajax 请求中提及 dataType: "script"？

$('.newness').on('hover',function () {
  $(this).addClass('hover');
  var newnessId = $(this).data('id');
  $.ajax({
    url: '/user_activities', 
    method: 'POST', 
    data: {
      user_activity: {
        activity_id: newnessId
      }
    },
   dataType: "script"
  })
})

Answer 2

有答案:) 在我的控制器中，我只是删除了

redirect_to root_path

class UserActivitiesController < ApplicationController

  def destroy
    @useractivity = UserActivity.find(params[:id])
    @useractivity.destroy
  end

  def create
    @user = current_user
    @useractivity = @user.user_activities.build(useractivities_params)
    @useractivity.save
  end

private

  def useractivities_params
    params.require(:user_activity).permit(:activity_id)
  end
end

Answer 3

有时 rails 将 ajax 请求作为 HTML 类型提交，然后您需要指定 dataType，您可以通过传递 dataType 或像我这样做。 你可以试试这样：

<script>
    $('.newness').hover(
        function () {
            $(this).addClass('hover');
           newnessId = $(this).data('id');
           $.ajax({url:'/user_activities.json', method: 'POST', data: {user_activity:{activity_id: newnessId}}})
        }
    )
</script>