0

我正在对fancybox 使用以下调用： $.fancybox.showActivity(); 显示加载动画。它适用于 Firefox 和 IE。然而，Chrome 和 Safari 非常不一致。因此，为了测试调用是否有问题，我创建了一个按钮并通过 JS 函数附加调用。当我单击按钮（以验证呼叫本身是否有效）然后按下实际上是我正在对其进行编码的按钮时，它就会起作用。但是，如果我不按（验证测试）按钮，而只按实际代码按钮，则它不会显示。我也可以在调试器中看到 div。这种不一致的功能有什么原因吗？

代码片段：

验证测试按钮：

<button type="button" onclick="checkFancybox();">Check Fancybox</button>            
<script>
function checkFancybox(){
$.fancybox.showActivity();
alert("Fancybox call completed.");
}
</script>

实际编码按钮：

<form id="video-upload-form" action="{url}?nexturl={nextUrl}" 
      method="post" enctype="multipart/form-data" >
<input name="file" type="file"/>
<input name="token" type="hidden" value=""/>
<input value="Upload Video File" type="button" name="submitVideoUpload" 
       onClick="checkFile()" class="button" />
</form>
<script> 
 function checkFile(){
    //RegEx for valid file name and extensions.
    var fileVal = document.forms["video-upload-form"].elements['file'].value;

    if(fileVal != ""){
      //notify user of activity
      $.fancybox.showActivity();
      document.getElementById('vintro-upload-form').submit();
    }else{alert('Please select the Video file.');}
 }
</script>

谢谢。

4

1 回答 1

0

只是为了正确......如果你在 HTML 中挂钩 js 函数，你最好使用

<input value="Upload Video File" type="button" name="submitVideoUpload" 
   onClick="javascript:checkFile();" class="button" />

“javascript:;” 很重要。这样您就可以确定它可以在 x-browser 上运行。

除此之外，您可能想以这种方式尝试：

<input id="mybutton" value="Upload Video File" type="button" name="submitVideoUpload" class="button" />
<script>
// Once the DOM is ready
$(function(){
    // bind your function
    $("#mybutton").click(function(){ checkFile(); });
});

// define your function
function checkFile(){
    //RegEx for valid file name and extensions.
    var fileVal = document.forms["video-upload-form"].elements['file'].value;

    if(fileVal != ""){
        //notify user of activity
        $.fancybox.showActivity();
        document.getElementById('vintro-upload-form').submit();
    }
    else { alert('Please select the Video file.'); }
}
</script>

在 DOM 加载后绑定点击处理程序。这样，当处理程序实际找到要挂钩的 HTML 时，它就可以被挂钩。

于 2012-07-10T15:57:35.337 回答