Question

我创建了一个JS函数，当它包含标准HTML链接标记的'onclick'操作时执行正常，如下所示：

<a href="#" onclick="return fb_CheckPermission('publish_stream');">test</a>

然而，我真正想要使用此函数的是表单的'onsubmit'操作，但是当我按如下方式包含它时，该函数似乎不再执行：

<form action="page.pl" id="disable-submit" name="status-form" method="POST" onsubmit="return fb_CheckPermission('publish_stream');">

'fb_CheckPermission（）'JS函数基本上做的是使用Facebook Connect检查以确保用户已授予我们特定权限，如果没有，则告诉Facebook Connect提示用户授予权限。这是JS函数的代码：

1. function fb_checkPermission(permission) {
2.  FB.ensureInit(function() {
3.      FB.Facebook.apiClient.users_hasAppPermission(permission, function (hasPermissions) {
4.          if(!hasPermissions){
5.              FB.Connect.showPermissionDialog(permission,function (status){
6.                  if(!status) {
7.                      if(permission == 'offline_access') {
8.                          // save session
9.                      }                       
10.                 }
11.             });
12.         }
13.     });
14. });
15.}

此代码的作用如下：

Line 2: Make sure Facebook Connect JS library is loaded
Line 3: Checks to see if the current Facebook Connect user has granted a specific permission
Line 5: If the permission hasn't been granted then prompt the user with the permission dialog
Line 7: In the case of the 'offline_access' permission save the session key once granted

我想要实现的用户体验是，当用户提交表单时，我会检查他们是否已经授予了特定权限，如果在提交表单之前没有提示他们获得权限。如果用户已经授予了表单应该提交的权限。对于那些被提示的用户，表单应该在他们选择授予权限后提交，或者拒绝我认为fb_checkPermission（）JS函数正在正确处理的请求。我不确定的是，在表单提交方面是否存在某种JavaScript问题。

正如我所提到的，这个JS函数完美地作为一个onclick动作，但作为onsubmit动作失败，所以我很确定这与JavaScript如何处理onsubmit动作有关。

我被困住了所以我真的很感谢你帮助找出如何改变JS功能以产生我想要的用户体验。在此先感谢您的帮助！

Answer 1

“点击主播”的原因是因为在所有Facebook异步调用完成时，它不会更改您的页面（位置）。

当您将相同的函数附加到提交处理程序时，该函数会在Facebook内容实际执行之前返回，并且它不会返回“false”，导致表单提前提交，而不是您希望的。

你需要做的是在你的onSubmit函数结束时返回“false”以防止提交并给Facebook完成时间，然后通过调用在你想要提交的地方手动提交表单：

document.getElementById('disable-submit').submit();

（如果从脚本触发提交，则不会调用处理程序。）

不幸的是我手边还没有Facebook SDK，所以我不能写出我确定100％有效的代码，但它是这样的：

function onSubmit () {
    doStuffAsynchronously(function () {
        if (everythingIsOK) {
            // proceed with submission
            document.getElementById('formId').submit();
        }
    });

    return false;
}

Answer 2

尝试将javascript调用放在您用于启动提交的输入上。

Answer 3

我认为基本上你的浏览器倾向于使用默认验证表单（page.pl / method POST），而不是按照你的想法做试试这个

<form action="page.pl" id="disable-submit" name="status-form"
      method="POST" onsubmit="returnFbChPermissionAndPreventDefaultAction();">
    <script type="text/javascript">
        var returnFbChPermissionAndPreventDefaultAction = function(){ 
           //prevent default
           if (event.preventDefault) { 
               event.preventDefault(); 
           } 

           //specific for IE
           valueOfreturn = fb_CheckPermission('publish_stream');
           event.returnValue = valueOfreturn;
           return event.returnValue ; 
        }
    </script>

在表单提交上调用JS函数

3 个答案: