Question

我希望通过向其添加事件监听器来点击按钮POST，但是使用ajax我可以进行呼叫，但我没有任何数据或成功，同样的错误标准。

我找到的一种方法是使用表单提交事件，但我想这不是正确的方法，我应该在点击按钮时进行POST调用。

<div id="googleSignInDiv" class="cols-row ">
   <form id="googleSignInform" action="/connect/google" method="post"
      target="google-auth-window">
      <button type="submit" class="btn-primary btn-sub-action  gss-col-12 type-300 social-button google" 
         id="signin-login-google-button" >
      <span class="icon social-icon"></span>
      <span class="btn-label">
      {{[loc-signin-google]}}
      </span>
      </button>
   </form>
</div>

如果我在onclick函数中执行此类操作，则无法正常工作，也不会出现任何错误。

$.ajax({
    url: '/connect/google',
    type: 'POST'
});

在此之后，我有我的代码打开新窗口。如何进行帖子调用并将其目标标记为我在代码中定义的google-auth-window？或者使用表格是正确的方法吗？

Answer 1

表单中submit类型按钮的默认行为是提交它，因此您必须先使用event.preventDefault()阻止默认行为，然后按照您要点击的内容进行操作按钮（例如：验证等）。在您的情况下，您可以调用进行AJAX调用的函数（makeAjaxRequest）。您的代码将如下所示：

$("#signin-login-google-button").click(function(event){
  event.preventDefault();
  makeAjaxRequest();
});
function makeAjaxRequest() {
  $.ajax({
      url: '/connect/google',
      type: 'POST',
      success: function(data){
        //code to open in new window comes here
      }
  });
}

ajax调用成功后，您可以编写代码在新窗口中打开它。您可以参考此answer获取相同内容。

Answer 2

我猜您的问题不在于如何处理Ajax来电，而是如何将google用户登录与用户集成，而不是通过提交表单来完成，但应该是异步。（纠正我，我错了:)）

我认为，如果你按照谷歌文档here，你可能会看到谷歌已经在（platform.js）中提供了一个库，用于通过ajax处理它，并以单独的形式打开它。

有了它，您可以使用只有

的谷歌登录按钮

<div class="g-signin2" data-onsuccess="onSignIn"></div>

它会打开一个登录窗口，并返回到您在Google API上配置中提供的回调网址。

如果你被困在任何地方，请告诉我。：）

javascript：点击按钮进行POST调用

2 个答案: