JavaScript / JQuery disabilita il pulsante di invio sul clic, prevenire il doppio invio
-
13-12-2019 - |
Domanda
Quindi ho il pulsante di invio che assomiglia a questo:
<a href="#" id="submitbutton"
onClick="document.getElementById('UploaderSWF').submit();">
<img src="../images/user/create-product.png" border="0" /></a>
.
Quando faccio doppio clic su di esso doppio invio ovviamente, e il problema è quello Sto salvando le informazioni nel database, quindi avrò le informazioni di Dublicate, E non lo voglio.Questo uploader utilizza Flash e JavScript e qui è un piccolo pezzo del codice che è rilevante per la quinta cosa (se aiuta)
$.fn.agileUploaderSubmit = function() {
if($.browser.msie && $.browser.version == '6.0') {
window.document.agileUploaderSWF.submit();
} else {
document.getElementById('agileUploaderSWF').submit();
return false;
}
}
.
Grazie ragazzi. Apprezzo il vostro aiuto.Questo è davvero qualcosa che non ero in grado di fare per me Perché ho una così piccola esperienza con JS e non so davvero come fare cose Grazie.
Soluzione
Prova questo tangendario:
$('#your_submit_id').click(function(){
$(this).attr('disabled');
});
.
Modifica 1
Oh, nel tuo caso è un collegamento e nessun pulsante di invio ...
var submitted = false;
$.fn.agileUploaderSubmit = function() {
if ( false == submitted )
{
submitted = true;
if($.browser.msie && $.browser.version == '6.0') {
window.document.agileUploaderSWF.submit();
} else {
document.getElementById('agileUploaderSWF').submit();
}
}
return false;
}
.
Modifica 2
Per semplificare questo, prova questo:
<!doctype html>
<html dir="ltr" lang="en">
<head>
<meta charset="utf-8" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
$(document).ready(function()
{
$('#yourSubmitId').click(function()
{
$(this).attr('disabled',true);
/* your submit stuff here */
return false;
});
});
//--><!]]>
</script>
</head>
<body>
<form id="yourFormId" name="yourFormId" method="post" action="#">
<input type="image" id="yourSubmitId" name="yourSubmitId" src="yourImage.png" alt="Submit" />
</form>
</body>
</html>
.
Usa elementi del modulo, come <input type="image" />
, per inviare un modulo non un collegamento normale.
funziona bene!
Dai un'occhiata a jquery.post () per inviare il modulo. Buona fortuna.
Modifica 3
Funziona bene anche per me:
<!doctype html>
<html dir="ltr" lang="en">
<head>
<meta charset="utf-8" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
<!--//--><![CDATA[//><!--
$(document).ready(function()
{
var agileUploaderSWFsubmitted = false;
$('#submitbutton').click(function()
{
if ( false == agileUploaderSWFsubmitted )
{
agileUploaderSWFsubmitted = true;
//console.log( 'click event triggered' );
if ( $.browser.msie && $.browser.version == '6.0' )
{
window.document.agileUploaderSWF.submit();
}
else
{
document.getElementById( 'agileUploaderSWF' ).submit();
}
}
return false;
});
});
//--><!]]>
</script>
</head>
<body>
<form id="agileUploaderSWF" name="agileUploaderSWF" method="post" action="http://your.action/script.php">
<input type="text" id="agileUploaderSWF_text" name="agileUploaderSWF_text" />
</form>
<a href="#" id="submitbutton"><img src="../images/user/create-product.png" border="0" /></a>
</body>
</html>
.
Speriamo che questo aiuti.
Altri suggerimenti
Aggiungi quanto segue al onclick
:
onclick="document.getElementById('submitbutton').disabled = true;document.getElementById('UploaderSWF').submit();"
.
Detto questo, dovrai gestire questa doppia prevenzione della prevenzione del server anche sul lato server.
Secondo http://api.jquery.com/prop/ È possibile aggiungere e rimuovere la proprietà disabilitata utilizzando la funzione .prop (), non le funzioni .ATTR () e .removeAttr ().
Per aggiungere la proprietà:
.prop("disabled", true);
.
Per rimuovere la proprietà:
.prop("disabled", false);
.
Spero che questo ti aiuterà.
Come proposto qui (con esempi):
Se si desidera assicurarsi che l'evento registrato sia sparato una sola volta, è necessario utilizzare JQuery's [One] [1]:
..one (Eventi [, Data], Gestore) Ritorna: JQuery
Descrizione: Allega un gestore a un evento per gli elementi.Il gestore viene eseguito al massimo una volta per elemento per tipo di evento.
Questo disabiliterà tutti i pulsanti e i collegamenti di invio con l'invio della classe o l'attributo dati-inviati in un modulo se uno è cliccato:
$(document).ready(function() {
$('form').submit(function() {
$(this).find('input[type="submit"]').attr('disabled', true);
$(this).find('a[data-submit], a.submit').click(function() {
return false;
});
}
});
.
Questo si applica automaticamente ad ogni forma, a proposito.Se ne vuoi solo un certo, usa l'ID invece della forma.Probabilmente lo sapevi già, però.