venturoso venturoso - 1 year ago 101
Javascript Question

Disabling double click works on Firefox, but does not work on Chrome

I need to prevent double click in a button, when the form is posted.

I have tried the following jQuery code:

$(this).submit(function () {
$('.btn').prop("disabled", "disabled");

And it works in Firefox browser, but not in Chrome.

Here is the HTML of my button:

<form name="aspnetForm" method="post" action="reset-password.aspx" id="aspnetForm">
<div class="orangeBTN">
<input type="button" name="ctl00$ctl00$content$content$btnSubmit" value="Submit" onclick="javascript:__doPostBack(&#39;ctl00$ctl00$content$content$btnSubmit&#39;,&#39;&#39;)" id="ctl00_ctl00_content_content_btnSubmit" class="btn pri" />

Is there a simple method that I can use that will be universal?

For your help, many thanks.


I am including the .aspx html, and the JavaScript that now seem to work for me.

<asp:Panel ID="pnlInput" CssClass="pnlInput" runat="server">
<fieldset id="resetPassRight">
<asp:Panel ID="pButtons" runat="server" CssClass="buttons">
<asp:Button ID="btnSubmit" Text="Submit" CssClass="btn pri" runat="server" />


<script type="text/javascript">
$(document).ready(function () {
$('.pnlInput fieldset .btn').one('click', function () {
$(this).attr('disabled', 'disabled');


Below there is the jQuery code that I ended up using. So far I think it works.

/** Start - This jQuery will disable double click */
$('.pnlInput fieldset .btn').one('click', function () {
$(this).attr("disabled", 'disabled');
/** End - This jQuery will disable double click */

One of the reasons jQuery was not executing was the fact that the asp button has a property of:


And this was preventing the client code to be evaluated correctly across different browsers.

Answer Source

If the input has a type="button" it will not trigger the submit function (not even on FF, or at least I was not able to get it), as you can see on this fiddle: (replaced the target with an empty function to avoid errors)

If you change the input to have type="submit", then the submit function will be triggered and the button will be disabled. You can see it on this other fiddle:

So, just change the input to a submit, and then the onsubmit event will be triggered.