Как отследить нажатие на ссылку и привязать к нему функцию?

Как можно модифицировать перечисленный JavaScript код, чтобы при нажатии на ссылки в диве с id="newprojects" с относительными путями загружался контент в этот же див, а не происходил переход по ссылке?
  • 27 февраля 2024 г. 8:38
Ответы на вопрос 2
Для отслеживания нажатия на ссылку и привязки к нему функции можно использовать метод addEventListener. К примеру:

```javascript
document.addEventListener('DOMContentLoaded', function() {
  document.getElementById('newprojects').addEventListener('click', function(event) {
    event.preventDefault(); // Отменяем стандартное действие по переходу по ссылке
    // Здесь можно указать функцию, которая будет обрабатывать нажатие на ссылку
    console.log('Ссылка была нажата');
  });
});
```

Для модификации кода, чтобы при нажатии на ссылки в диве с id="newprojects" с относительными путями загружался контент в этот же див, можно воспользоватся AJAX запросами. К примеру:

```javascript
document.addEventListener('DOMContentLoaded', function() {
  document.getElementById('newprojects').addEventListener('click', function(event) {
    event.preventDefault(); 
    var link = event.target.getAttribute('href');
    var xhr = new XMLHttpRequest();
    xhr.open('GET', link, true);
    xhr.onload = function() {
      if (xhr.status >= 200 && xhr.status < 400) {
        document.getElementById('newprojects').innerHTML = xhr.responseText;
      }
    };
    xhr.send();
  });
});
```

Таким образом, при нажатии на ссылку в диве с id="newprojects" будет загружен контент в этот же див без перехода по ссылке.
event.preventDefault() - при клике по ссылке не пробовали это добавить ?
Похожие вопросы