Помощь с блокировкой всплывающих окон в Javascript

Разработка
1

Привет! Я не очень хорошо разбираюсь в JavaScript и попробовал использовать 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 = "Это содержимое всплывающего окна!";
    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-приложение, и реализация чего-то подобного, вероятно, гораздо сложнее, чем простые JS-решения… Скорее всего, вам потребуется больше помощи, чем может предоставить ChatGPT, и я не уверен, что вы получите такой уровень поддержки бесплатно здесь!

Тем не менее, прежде чем кто-либо сможет дать вам совет, нам нужно узнать больше о том, чего вы пытаетесь достичь. Где именно в Discourse расположена эта таблица? Внутри поста? Где-то ещё? Какая информация должна содержаться в этом блоке?

3

Думаю, вы правы, но я об этом размышлял (хотя и не смотрел код), и мне кажется, что Discourse Translator делает нечто очень похожее. Думаю, стоит начать с него, но фраза «эй, я не особо разбираюсь в JavaScript», вероятно, не отражает тот уровень навыков, который нужен для реализации этой идеи.

Предполагаю, что человеку, знакомому с написанием плагинов, потребуется от 5 до 10 часов (но, возможно, всего 2 часа для создания рабочего прототипа).

4

Ничего страшного, ха-ха.
Таблица в Discourse находится «под заголовком» на главной странице. Я планирую вручную вставить несколько ссылок на текст в ячейки. Дайте знать, если вам понадобится ещё какая-то информация.