كيفية إضافة JS بعد الترويسة؟

[DragonByte]

مرحباً!

أرغب في إضافة نص برمجي إلى “After Header” في مكون السمة الخاص بي، لكنه لا يعمل.

الكود:

<button type="button" class="btn btn-outline btn-small" id="Send">Send</button>

<script>
var btn = document.querySelector('#Send');

btn.addEventListener('click', function(e) {
  e.preventDefault();
  
  this.disabled = true;
  
  setTimeout(function(){ btn.disabled=false; }, 10000);
});
</script>

يعمل الكود في كتلة أخرى (Head, Body)، لكنني بحاجة إلى إضافته في After Header.

من فضلك ساعدني، كيف يمكنني فعل ذلك؟

[pfaffman (Jay Pfaffman)]

ربما أضف البرنامج النصي في الرأس والزر بعد الرأس.

[DragonByte]

أحاول إضافة زر إلى بعد الرأس وإضافة الكود مع النص البرمجي إلى الرأس، أرى الزر ولكن النص البرمجي لا يعمل.

إنه يعمل فقط إذا أضفت كل الكود (الزر + النص البرمجي) في head_tag، في أقسام أخرى لا يعمل، أحتاج إلى إضافة هذا في after_header

[keegan (Keegan George)]

هذا ببساطة غير ممكن. لاحظ أن دليل المطورين يذكر أن لديك ثلاثة خيارات فقط لعلامات النص البرمجي ليتم تشغيلها:

@Johani

الآن، بما أن هذا نص برمجي، نحتاج إلى توخي الحذر قليلاً بشأن مكان إضافته لضمان تشغيله. لديك أحد الخيارات الثلاثة:

1. قسم </head>
2. قسم الرأس (Header)
3. قسم </body>

إضافة النص البرمجي إلى أي قسم آخر سيؤدي إلى عدم تشغيله.

هل هناك سبب معين لاحتياجك إلى الكود في قسم after_header؟ قد تكون هناك طرق أخرى يمكنك اتباعها لتحقيق ما تحتاجه.

عندما حاولت فصل النص البرمجي في الرأس والزر في after_header، هل أنت متأكد من أن النص البرمجي لا يعمل على الإطلاق، أم أنك غير قادر على تحديد الزر؟ قد يكون ذلك بسبب طريقة عمل حلقة تشغيل Ember.

ربما يمكنك محاولة تغليف النص البرمجي الخاص بك في

<script type="text/discourse-plugin" version="0.8" >
api.onPageChange(() => {
   var btn = document.querySelector('#Send');

   btn.addEventListener('click', function(e) {
     e.preventDefault();
  
    this.disabled = true;
  
     setTimeout(function(){ btn.disabled=false; }, 10000);
   });

});
</script>

[DragonByte]

لقد وجدت الحل في: Add custom content that only appears on your homepage

شكرا