جافا سكريبت / مسج تعطيل زر الإرسال عند النقر، ومنع الإرسال المزدوج

https://stackoverflow.com//questions/11705337

13-12-2019
|

سؤال

لذلك لدي زر الإرسال الذي يبدو كما يلي:

<a href="#" id="submitbutton" 
onClick="document.getElementById('UploaderSWF').submit();">
<img src="../images/user/create-product.png" border="0" /></a>

عندما أقوم بنقر مزدوجًا على تقديمه مزدوجًا ، والمشكلة هي أنني أقوم بحفظ المعلومات الموجودة في قاعدة البيانات ، لذا سأحصل على معلومات DubLicate هناك ، ولا أريد ذلك.يستخدم هذا التحميل فلاش وجافسريبت ، وهنا جزء صغير من التعليمات البرمجية ذات صلة بالشيء إرسال (إذا كان يساعد)

$.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" />, ، لتقديم نموذج وليس رابط عادي.

هذا يعمل بشكل جيد!

نلقي نظرة على مسج.بوست () لتقديم النموذج الخاص بك.

حظ سعيد.

تحرير 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();"

ومع ذلك، سيتعين عليك التعامل مع منع الإرسال المزدوج من جانب الخادم أيضًا.

وفقا ل http://api.jquery.com/prop/ يمكنك إضافة وإزالة خاصية المعطلة باستخدام وظائف .PROP () وليس وظائف .attr () و .removeattr ().

لإضافة الخاصية:

giveacodicetagpre.

لإزالة الخاصية:

giveacodicetagpre.

آمل أن يساعدك ذلك.

كما اقترح هنا (مع أمثلة):

إذا كنت ترغب في التأكد من إطلاق الحدث المسجل مرة واحدة فقط، يجب عليك استخدام JQuery's [One] [1]:

.On (الأحداث [، البيانات]، المعالج) إرجاع: jQuery

الوصف: إرفاق معالج إلى حدث للعناصر.يتم تنفيذ المعالج مرة واحدة مرة واحدة لكل عنصر لكل عنصر لكل نوع من الأحداث.

ستعطيل جميع الأزرار ويرتبط جميعها مع إرسال الفئة أو بيانات السمة - إرسالها في نموذج إذا تم النقر فوق المرء:

giveacodicetagpre.

هذا ينطبق تلقائيا على كل نموذج، بالمناسبة.إذا كنت تريد فقط واحدة معينة، استخدم المعرف بدلا من النموذج.ربما كنت تعرف بالفعل ذلك، على الرغم من ذلك.

مرخصة بموجب: CC-BY-SA مع الإسناد

لا تنتمي إلى StackOverflow