자바 스크립트 / jQuery Submit 버튼을 클릭하고 두 번 제출을 방지합니다.
https://stackoverflow.com//questions/11705337
-
13-12-2019 - |
italiano
english
français
española
中国
日本の
العربية
Deutsch
한국어
Português
Russian문제
다음과 같이 보이는 제출 버튼이 있습니다.
<a href="#" id="submitbutton"
onClick="document.getElementById('UploaderSWF').submit();">
<img src="../images/user/create-product.png" border="0" /></a>
내가 두 번 클릭하면 분명히 이중 제출을 클릭하고 문제는 저는 데이터베이스에 정보를 저장하므로 다초의 정보를 가지고 있습니다. 그리고 나는 그것을 원하지 않는다.이 업 로더는 Flash와 JavScript를 사용하고 여기에는 조각이 있습니다. 제출물과 관련된 코드 (도움이되는 경우)
$.fn.agileUploaderSubmit = function() {
if($.browser.msie && $.browser.version == '6.0') {
window.document.agileUploaderSWF.submit();
} else {
document.getElementById('agileUploaderSWF').submit();
return false;
}
}
감사합니다. 당신의 도움에 감사드립니다.이것은 내가 정말로 나 자신을 할 수없는 것입니다. 나는 JS에 대한 작은 경험이 있기 때문에 나는 정말로 어떻게 알지 못한다. 물건을 할 수 있습니다. 고마워.
해결책
이 찍은 시도 :
$('#your_submit_id').click(function(){
$(this).attr('disabled');
});
편집 1
오, 귀하의 경우에는 링크가 있고 제출 버튼이 없습니다 ...
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;
}
편집 2
이를 단순화하려면 다음을 시도하십시오.
<!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>
<input type="image" />와 같은 양식 요소를 사용하여 정상 링크가 아닌 양식을 제출하십시오.
이것은 잘 작동합니다!
jquery.post () 폼을 제출하려면 행운을 빕니다.
편집 3
이것은 나에게도 잘 작동합니다 :
<!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>
잘하면이 도움이됩니다.
다른 팁
onclick에 다음을 추가합니다.
onclick="document.getElementById('submitbutton').disabled = true;document.getElementById('UploaderSWF').submit();"
서버 측 에서이 이중 제출 방지를 처리해야합니다.
속성을 추가하려면 다음과 같이하십시오.
.prop("disabled", true);
속성을 제거하려면 :
.prop("disabled", false);
이것이 당신을 도울 것입니다.
제안 된 여기 (예제 포함) :
등록 된 이벤트가 한 번만 해고되었는지 확인하려면 jQuery의 [One] [1] :
를 사용해야합니다..One (이벤트 [, 데이터], 핸들러) 반환 값 : jQuery
설명 : 요소에 대한 이벤트에 핸들러를 첨부하십시오.핸들러는 이벤트 유형당 요소 당 대부분 한 번 실행됩니다.
이렇게하면 모든 제출 단추 및 클래스 제출 또는 속성 데이터 제출과의 링크가 클릭 한 경우
$(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;
});
}
});
이것은 모든 형식에 자동으로 적용됩니다.특정한 사람을 원한다면 양식 대신 ID를 사용하십시오.당신은 아마도 이미 그것을 알고 있었을 것입니다.
