jQuery BlockUI 出错答案

【问题标题】：Error with jquery BlockUIjQuery BlockUI 出错
【发布时间】：2013-06-04 13:13:05
【问题描述】：

我已经多次使用这个插件，方式与这里看到的非常相似，但我的最新实现无法正常工作。

这里是 JavaScript：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/jquery.blockUI.js" type="text/javascript"></script>
<script type="text/javascript">
   function disableButtons(){
        alert('TEST'); //this is here just to see if the function is called
        $('div.blockbutton').block({
            message: '<h4>Saving...</h4>',
            css: { border: '2px solid orange' }
         });
     }
</script>

还有 HTML：

<div align="center" class="blockbutton">
    <input name="save" type="button" class="btn6022" value="Save" 
       onClick=disableButtons();
         <c:if test='${(sessionScope.package != "NWR")}'>                        
       saveConfirm1(onset_date,report_date,lost_consciousness_date,fatal_death_date);">
         </c:if>
         <c:if test='${(sessionScope.package == "NWR")}'>                        
       "saveConfirm2(onset_date,report_date,fatal_death_date);">
          </c:if>
     </div>

这是我的 Firebug 控制台在触发该功能时给我的信息： TypeError: $(...).block 不是函数 [打破这个错误]

css: { 边框：'2px 纯橙色' }

我很困惑，因为这段代码与我在其他页面上所做的相同，没有失败。有人可以在这里发现我遗漏的问题吗？

【问题讨论】：

发布我的答案后，我意识到您可能正在尝试做什么。您是否尝试同时调用 disableButtons() 和 saveConfirm1/2 onClick？
没错，我同时称呼他们。 disableButtons() 被调用，因为弹出了我作为测试输入的警报，但该函数的其余部分失败，因此也无法调用 saveConfirm1/2 函数。

标签： javascript jquery blockui jquery-blockui

【解决方案1】：

我发现您的 <c:if> 块中有一些不一致之处。底部的 saveConfirm2 用双引号括起来。在 saveConfirm 之后，顶部只有一个双引号。即使没有这个问题，也不完全清楚您要做什么，因此只需查看呈现的 HTML 以确保它有意义。另外，我不熟悉，但从快速搜索来看，它看起来是 JSP。在这种情况下，<c:if> 块仅用于条件渲染。这些块内的内容应以/> 结尾以关闭<input 节点。为了正确关闭节点并使您的两个函数都被调用 onClick，您需要进行以下修改。我使 onClick 以双引号开头。然后 c:if 块中的内容关闭了最初的开始报价并关闭了

   onClick="disableButtons();
     <c:if test='${(sessionScope.package != "NWR")}'>                        
   saveConfirm1(onset_date,report_date,lost_consciousness_date,fatal_death_date);" />
     </c:if>
     <c:if test='${(sessionScope.package == "NWR")}'>                        
   saveConfirm2(onset_date,report_date,fatal_death_date);" />
      </c:if>

我认为您看到了由于 HTML 格式错误导致的 javascript 错误。

【讨论】：

我试过这个，但没有任何区别。 disableButtons() 函数正在工作但失败（显然是由于 .block 函数不起作用 - 它应该这样做，因为包含 jquery.blockUI.js 文件。同样，这适用于我放置的所有其他文件在，只是不是这个。
我想知道函数是否由于 HTML 格式错误而失败。我已经看到它发生了，但我不完全确定它会在你的情况下解决它。如果是这样，祝你好运找到解决方案。我确定您已经三重检查了您的库是否被正确包含，但除此之外，我对导致此问题的原因没有其他想法。
我怀疑 HTML 可能是问题所在，但如果我只是删除 disableButtons() 函数，一切正常。
我尝试了与您所拥有的非常相似的东西。呈现的 HTML 为：<div align="center" class="blockbutton"><input name="save" type="button" class="btn6022" value="Save" onClick="disableButtons(); testfunc2();" /></div>。该函数被正确调用并显示漂亮的 BlockUI 界面。您确定在这两个脚本资源中的任何一个上都没有得到 404 或类似的信息吗？它对我有用，没有太大变化，只是我的源文件中只有最终呈现的 HTML。
没有 404 ——我不确定发生了什么——只是宇宙中无法解释的谜团之一。

【解决方案2】：

$.browser 在 1.9.1 中被移除 http://forum.jquery.com/topic/jquery-blockui-plugin-broken-with-jq-1-9-1

【讨论】：