Javascript 标记用户开始在表单中键入内容的时间_Javascript_Ruby On Rails_Ajax_Jquery

Javascript 标记用户开始在表单中键入内容的时间

javascript ruby-on-rails ajax jquery

Javascript 标记用户开始在表单中键入内容的时间,javascript,ruby-on-rails,ajax,jquery,Javascript,Ruby On Rails,Ajax,Jquery,我想在用户开始键入表单时，将用户添加到帖子的作者列表中例如，当用户在表单中键入任何字母（或按下“回车”按钮）时，我会调用@post.authors.create（user\u id:current\u user.id），将用户添加到该特定帖子的作者列表中。我认为这是不可能实现的，但是使用javascript提交ajax请求就足以实现此方法。有可能在Rails应用程序中实现这种方法吗？如果是这样的话，有人能给我一些指导吗？您必须为按键制作事件处理程序，并在第一次按下后将其删除 function

我想在用户开始键入表单时，将用户添加到帖子的

作者

列表中

例如，当用户在表单中键入任何字母（或按下“回车”按钮）时，我会调用

@post.authors.create（user\u id:current\u user.id）

，将用户添加到该特定帖子的作者列表中。我认为这是不可能实现的，但是使用javascript提交ajax请求就足以实现此方法。有可能在Rails应用程序中实现这种方法吗？如果是这样的话，有人能给我一些指导吗？

您必须为按键制作事件处理程序，并在第一次按下后将其删除

function typeCatch(){
  $(this).off("keypress",typeCatch)//remove handler
  console.log("User start type");
}

$("$field_id").on("keypress",typeCatch)

对于下面的答案，我假设您使用jQuery作为javascript框架运行RubyonRails，并让当前用户（=作者）登录（即会话中的当前用户id）。我在解释@Misha的想法：使用按键事件

因此，正如您所解释的，您有一个表单来编辑帖子。我猜你有一个文本区里面有帖子的文本。例如，这是一篇文章

您的下一个要求是告诉服务器，“当用户在表单中键入任何字母（或按下“回车”按钮）时”。因此，我们为“keypress”事件定义了一个事件处理程序。按下第一个键后，应删除此事件处理程序。感谢@user2257149提供了以下代码（我对其进行了一些调整）：

此javascript代码片段必须低于

的定义

现在我们有了一个只触发一次的事件处理程序。在这个处理程序中，我们触发一个ajax调用，让服务器知道当前用户正在编辑当前帖子。在更新post对象中的特定属性时，我们应该触发如下URL：

PUT http://www.example.com/posts/123/add_current_author

这意味着，我们应该在

PostsController

中使用httpput方法更新ID为123的post，并触发add\u current\u author方法

因此，我们将函数

typeCatch（）

调整为：

function typeCatch(){
  $(this).off("keypress",typeCatch)//remove handler
  $.ajax({
    type: "POST",
    url: '/posts/123/add_current_author',
    data: JSON.stringify({_method: 'put'})
  });
}

（由于大多数浏览器不支持PUT方法，Ruby on Rails通过发送POST参数“_method”来欺骗它，我在他的文章中从@Michael Koper那里得到了这个）

您可能必须将此特殊路径添加到RubyonRails（不确定以下内容，我的Rails有点生锈）：

现在，在您的

PostsController

中，您必须定义方法

add\u current\u author

。我假设您将

@post

实例化为

过滤器之前的中的实际post（由给定的:id
标识），并将当前用户保存在当前用户中。所以实际上，它应该很容易：
def add_current_author
  @post.authors.create(user_id: current_user.id)
end

虽然我必须承认，它看起来有点奇怪（这是你建议的）。我想，我会在“帖子”和“用户”之间建立一个1:n的连接，称为“作者”，并执行以下操作：
@post.authors << current_user

应删除给定行，因为在显示@those
时不应添加当前用户。此外，我在上面定义的
是注释表单中的一个，因此HTML可能看起来像
<html>
  ...
  <form action="essay/123/comment" method="post">
    ...
    <textarea name="comment_text" id="comment"></textarea>
    ...
  </form>
  <script type="text/javascript">
    function typeCatch() {
      ...
    }
    $("#post").on("keypress", typeCatch);
  </script>
</html>

大家都忘记jQuery的$.one（）
函数了吗？它的功能与执行$相同。打开（）
，然后在$内关闭（）
您应该侦听表单上的事件。如果发生这种情况，请使用将当前用户发布到控制器。在用户实际提交表单（可能保存任何更改）之前，是否有理由将其添加为作者？我认为你想要的方式会更加困难，并且可能会给你带来更多的麻烦，特别是如果用户删除他们所做的任何更改，或者根本不保存它们。如果你真的需要这么做，那肯定是有可能的，根本不是一个惯例。如果我只是在这里输入，而不点击“添加评论”，你就永远看不到我的评论。我很清楚其中的逻辑。用户是否在事后提交表单对我来说并不重要。我想实现这个功能，让用户知道是否有人（将临时添加为“作者”）正在编辑某篇文章。@Misha你能再解释一下吗？我知道我必须听一个keydown事件，但对将当前用户发布到控制器知之甚少。
def add_current_author
  @post.authors.create(user_id: current_user.id)
end

@post.authors << current_user

def show
  ...
  @essay.reader_links.create(reader_id: current_user.id)
  ...
end

<html>
  ...
  <form action="essay/123/comment" method="post">
    ...
    <textarea name="comment_text" id="comment"></textarea>
    ...
  </form>
  <script type="text/javascript">
    function typeCatch() {
      ...
    }
    $("#post").on("keypress", typeCatch);
  </script>
</html>

function typeCatch(){
  $.ajax({
    type: "POST",
    url: '/posts/123/add_current_author',
    data: JSON.stringify({_method: 'put'})
  });
}
$("#post").one("keypress", typeCatch);