2013-07-29 51 views
0

我想在回發之前禁用頁面上的所有提交按鈕。發現3(略)不同的代碼示例,但沒有在我的方案中工作。在回發之前禁用提交按鈕

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

     // 1 
     $('#form1').one('submit', function() { 
      alert('.one'); 
      $(this).find('input[type="submit"]').attr('disabled', 'disabled'); 
     }); 

     // 2 
     $("#form1").submit(function() { 
      alert('.submit1'); 
      $('input[type=submit]').click(function() { return false; }); 
     }); 

     // 3 
     $("#form1").submit(function() { 
      alert('.submit2'); 
      $('input[type=submit]').click(false); 
     }); 
    }); 
</script> 

HTML(從查看源代碼):

<body> 
    <form method="post" action="WebForm12.aspx" id="form1"> 
<div class="aspNetHidden"> 
<input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKMjA0OTM4MTAwNGRk6dbofDK5YUWMwPmdBDnRWPCTyBN22BpAo7Y3C+2Gycs=" /> 
</div> 

<div class="aspNetHidden"> 

    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEWAgKC36LkAgKr4aeRA6gaPoGNYlZvnjW07iB+LnlhIUr0qrTFHOADKmQQuhv0" /> 
</div> 
    <div> 
     <input type="submit" name="btnPost" value="Post" id="btnPost" /> 
    </div> 
    </form> 
</body> 

更新

好,通過putvande指示的實際問題是在定義ready事件功能關鍵字。然而,代碼樣本仍然沒有達到目的。

示例1實際上沒有運行相關的OnClick處理程序,因爲它沒有將按鈕的值由於被禁用而回發到服務器。

樣本2/3一次阻止後續回發,但在UI上啓用了該按鈕。

進一步的搜索結束了更合適的技術來解決這個問題。下面的代碼使用onbeforeunload事件完全禁用提交按鈕。

window.onbeforeunload = DisableButtons; 

function DisableButtons() { 
    $("input[type=submit]").attr('disabled', 'disabled'); 
} 
+0

我不認爲你的第一個例子會工作,因爲你使用舊版本的jQuery。但你想做什麼?點擊提交按鈕後,你想禁用提交按鈕? – putvande

+0

@putvande是的。以避免在回傳過程中重新提交。 –

+0

雖然 –

回答

0

您的活動永遠不會被分配到您的form。 您需要更改:

$(document).ready(new function() { 
        ^^^ 

要:

$(document).ready(function() { 

如果更改提交功能將正常工作。

+0

噢,我的上帝...... :) –

0
$('input[type="submit"]').attr('disabled', 'disabled'); 
return false; 
+0

雖然 –

0

在某種程度上,你可以做到這一點,如下所述。

您可以添加一個更多的按鈕與顯示:無。在可見按鈕javascript單擊事件中,可以禁用此按鈕並調用隱藏按鈕的單擊(document.getElementById('btnHidden')。click())。

需要在可見的按鈕點擊上執行的實際代碼進入隱藏按鈕的事件處理程序。

更新:

我不認爲一個更大的圖片。如果應用廣泛,你可能要考慮這個..

對於按鈕的OnClientClick您可以分配此功能...

function disableButton(btnID) 
{ 
    setTimeout(function(){document.getElementById(btnID).style.background = "disabled.jpg";}, 10); 
    document.getElementById(btnID).disabled = true; 
    return true; 
} 

「disabled.jpg」是一個背景,您可以將它指定給背景,從而使按鈕的顯示效果不受影響。

這樣一來,您可以暫時禁用用戶的外觀;但是這是一個非常短暫的時間,通過這個表單將已經發布到服務器。

+0

您的解決方法可能會正常工作,但實際上它並未到達'alerts'。但是,我想實現它在應用程序範圍內使用母版頁和jQuery。 –