ما هي أفضل طريقة لتجنب رمز الازدواجية في هاتين الوظيفتين أن تفعل نفس الشيء ؟

StackOverflow https://stackoverflow.com/questions/1633630

سؤال

ونظرا لهذا النموذج (الذي يحتوي على زر الإرسال):

<form id="review_form">
  <input type="submit" id="btn_submit" value="Submit with ajax! (submit button)">
</form>

و هذا الرابط (أن يقدم نفس شكل):

<a href="#" id="lnk_submit">Submit with ajax! (hyperlink)</a>

في ما يلي رمز مسج, عندما #btn_submit عنصر النقر على النموذج (#review_form) مقدم مع اياكس:

jQuery.fn.submitWithAjax = function() {
  this.submit(function() {
    $.post(this.action, $(this).serialize(), null, "script");
    return false;
  })
  return this;
};

$(document).ready(function() {
  $("#btn_submit").submitWithAjax();
})

ما أريد القيام به هو إزالة زر تقديم و إرسال النموذج باستخدام الرابط أعلاه (#lnk_submit) شيئا من هذا القبيل:

$("#lnk_submit").click(function(){ 
   $("#review_form").submit(function() {
    $.post(this.action, $(this).serialize(), null, "script");
    return false;
    }); 
   return false;
});

ولكن المشكلة هي أن هذه التكرارات كافة التعليمات البرمجية في jQuery.fn.submitWithAjax المحددة أعلاه.

ما هي أفضل طريقة لتجنب رمز الازدواجية هنا ؟

هل كانت مفيدة؟

المحلول

ما رأيك أن تعمل مثل هذا:

function submitWithAjax() {
    $("#review_form").submit(function() {
        $.post(this.action, $(this).serialize(), null, "script");
        return false;
    });         
}

ثم ربط كل الإجراءات إلى الدالة:

$(document).ready(submitWithAjax);
$("#lnk_submit").click(submitWithAjax);

نصائح أخرى

ربما أنا تبسيط, ولكن لا يمكنك تعيين وظيفة متغير ، وإعادة استخدامها ؟

var submitWithAjaxFn = function() {
  this.submit(function() {
    $.post(this.action, $(this).serialize(), null, "script");
    return false;
  })
  return this;
};

jQuery.fn.submitWithAjax = submitWithAjaxFn;
$("#lnk_submit").click(function(){ 
   $("#review_form").submit(submitWithAjaxFn); 
   return false;
});

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

إذا كنت تريد نفس الوظائف من الارتباط التشعبي ، وجعل عمل الارتباط التشعبي مجرد النقر على زر.

$('#lnk_submit').click(function(e){ $('#btn_submit').click(); return false; });
مرخصة بموجب: CC-BY-SA مع الإسناد
لا تنتمي إلى StackOverflow
scroll top