jQuery BlockUI错误

Question

I've used this plugin many times, in very much the same manner as seen here, and yet my latest implementation is not working.

Here is the 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>

And the 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>

Here is what my Firebug console is giving me when triggering the function: TypeError: $(...).block is not a function [Break On This Error]

css: { border: '2px solid orange' }

I'm baffled since this code is identical to what I have done on other pages, without fail. Can someone spot a problem here I'm missing?

Answer 1

I see some inconsistencies within your <c:if> blocks. The bottom one wraps saveConfirm2 in double quotes. The top one only has a double quote at the end after saveConfirm. Even without that issue, it's not completely clear what you are trying to do, so just take a look at the rendered HTML to make sure it makes sense. Also, I'm not familiar, but it looks to be JSP from a quick search. In that case, the <c:if> blocks are just for conditional rendering. The content inside those blocks should end in /> to close the <input node. In order to close the node correctly and for both of your functions to get called onClick, you need to have the modifications below. I made the onClick start with a double quote. Then the content in the c:if blocks closes the initial opening quote and closes the

   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>

I think you were seeing the javascript errors due to malformed HTML.

Answer 2

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