مساعدة في حظر النوافذ المنبثقة لجافاسكريبت

مطور
1

مرحباً، أنا لست خبيراً حقاً في جافاسكريبت وحاولت استخدام ChatGPT لإنشاء نص برمجي يسمح للعناصر الموجودة في حقل بعرض نافذة منبثقة بمعلومات عند النقر عليها. العناصر موجودة في جدول إذا كانت هذه المعلومة مطلوبة أيضاً.

const tableElement = document.querySelector("table");

// إضافة مستمع حدث النقر إلى الجدول
tableElement.addEventListener("click", function(event) {
  // الحصول على العنصر الذي تم النقر عليه
  const clickedElement = event.target;

  // قم بشيء ما فقط إذا كان العنصر الذي تم النقر عليه هو خلية جدول (td)
  if (clickedElement.tagName === "TD") {
    // إنشاء عنصر النافذة المنبثقة وإضافته إلى الصفحة
    const popup = document.createElement("div");
    popup.classList.add("popup");
    popup.innerHTML = "This is the pop-up content!";
    document.body.appendChild(popup);

    // تحديد موضع النافذة المنبثقة بجوار العنصر الذي تم النقر عليه
    const rect = clickedElement.getBoundingClientRect();
    popup.style.top = `${rect.top + window.scrollY + 10}px`;
    popup.style.left = `${rect.left + window.scrollX + 10}px`;
  }
});

لقد أنشأ هذا ولكن عند تجربته لا يعمل. هل هناك أي مساعدة فيما هو خطأ في هذا؟

2

يعد Discourse تطبيق JavaScript معقدًا وتحقيق شيء كهذا ربما يكون أكثر تعقيدًا من بعض أكواد JavaScript البسيطة… من المحتمل أنك ستحتاج إلى مزيد من المساعدة مما يمكن أن يقدمه ChatGPT، ولست متأكدًا من أنك ستحصل على هذا المستوى من الدعم مجانًا هنا!

ومع ذلك، قبل أن يتمكن أي شخص من تقديم المشورة لك هنا، سنحتاج إلى معرفة المزيد حول ما تحاول تحقيقه. أين يقع هذا الجدول في Discourse؟ داخل منشور؟ في مكان آخر؟ ما هي المعلومات التي ستكون ضمن هذه الكتلة؟

4 إعجابات
3

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

أفترض أن شخصًا على دراية بكتابة الإضافات سيحتاج إلى 5-10 ساعات (ولكن ربما ساعتين لإثبات المفهوم).

إعجابَين (2)
4

لا بأس هههههه.
يوجد الجدول في ديسكورس “تحت العنوان”، في الصفحة الرئيسية. أخطط لإدخال نصوص متعددة مرتبطة يدويًا في المربعات. أخبرني إذا كنت بحاجة إلى أي معلومات أخرى.