2013-07-18 35 views
0

我想在jQuery中编写if else语句。如果点击该按钮,则禁用该按钮,直到动作完成,然后仅启用。这是我目前拥有的代码。当我导航到页面时,操作不停地循环。由于我还不熟悉jQuery,请耐心等待。使用jquery禁用按钮,并在使用jQuery完成操作后启用

仅供参考,我使用primefaces COMMANDBUTTON

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3c.org/1999/xhtml" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:p="http://primefaces.org/ui" 
    xmlns:hx="http://www.ibm.com/jsf/html_extended"> 
<h:head> 
    <title>ma1009.xhtml</title> 
    <meta http-equiv="keywords" content="enter,your,keywords,here" /> 
    <meta http-equiv="description" 
    content="A short description of this page." /> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 

    <script src="../../jquery-1.9.1.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 

      if ($("#button").click()) { 
       $("#button", this).prop('disabled', true); 
      } else { 
       $("#button", this).prop('disabled', false); 
      } 

     }); 
    </script> 
</h:head> 

<h:body> 
    <h:form id="form1" enctype="multipart/form-data" prependId="false"> 

     <p:commandButton id="button" type="submit" value="Submit" 
      action="#{pc_Ma1009.doSubmitAction}" ajax="false"></p:commandButton> 

    </h:form> 
</h:body> 
</html> 
+2

看来你的代码是完全错误的,告诉我什么样的动作是打算完成的? –

+0

@ABFORCE the action =“#{pc_Ma1009.doSubmitAction}”。这将需要大约15秒才能完成。 – hahagal

+0

我认为Alexey Aza的答案对你很有帮助,你应该在'Alexey Aza'的指定位置做你的动作回答 –

回答

0

我设法用下面的代码来得到它。 @ABFORCE感谢您的帮助! ^^ @Alexey Aza感谢您的帮助! ^^

<?xml version="1.0" encoding="UTF-8"?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3c.org/1999/xhtml" 
    xmlns:ui="http://java.sun.com/jsf/facelets" 
    xmlns:f="http://java.sun.com/jsf/core" 
    xmlns:h="http://java.sun.com/jsf/html" 
    xmlns:p="http://primefaces.org/ui" 
    xmlns:hx="http://www.ibm.com/jsf/html_extended"> 
<h:head> 
    <title>ma1009.xhtml</title> 
    <meta http-equiv="keywords" content="enter,your,keywords,here" /> 
    <meta http-equiv="description" 
     content="A short description of this page." /> 
    <meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 

    <link type="text/css" rel="stylesheet" 
     href="#{request.contextPath}/theme/primefaces-aristo/theme.css" /> 

    <script src="../../jquery-1.9.1.min.js"></script> 
    <script type="text/javascript"> 
     $(document).ready(function() { 
      $("button").click(function() { 
       $(this).css('background', 'red'); 
       $(this).addClass('ui-state-disabled'); 
      }); 
     }); 
    </script> 
</h:head> 

<h:body> 
    <h:form id="form1" enctype="multipart/form-data" prependId="false"> 

     <p:commandButton id="button" type="submit" value="ma1009" styleClass="commandButton" 
      action="#{pc_Ma1009.doSubmitAction}" widgetVar="ajaxStatusDialog"> 
      <p:ajaxStatus onstart="ajaxStatusDialog.show();" onsuccess="ajaxStatusDialog.hide();"></p:ajaxStatus> 

     </p:commandButton> 

    </h:form> 
</h:body> 
</html> 
2

应该是这样的:

$(document).ready(function(e) { 
    e.preventDefault(); 
    $("#button").click(function(){ 
     $(this).prop("disabled", true); 
     //your action (maybe function pc_Ma1009.doSubmitAction()), look at your html generated by <p:commandButton id="button" 
     $(this).prop("disabled", false); 
    }); 

}); 
+0

为什么'e.preventDefault();'? –

+0

没有注意到它是提交 –

+0

ups ...你是对的:) –