событие onclick jquery не работает для ссылки

#javascript #jquery #jsp

#javascript #jquery ( jquery ) #jsp

Вопрос:

незадолго до этого у меня был скрипт в верхней части моей страницы jsp </head> . все работает так, как ожидалось, за исключением события onclick for <a> . это мой код:

 $(document).ready(function () {
  $.ajax({
    url: 'paging',
    type: 'GET'
  }).success(function (data) {
    $('#pagination').empty();
    $.each(data, function (index, user) {
      $('#pagination').append($('<tr>')
        .append($('<td>').append($('<a>').attr({
          'onclick': 'GoToProfile('   user.username   ')'
           }).text(user.username)))
        .append($('<td>').text(user.email)))
      });
    
      $("#sales").dataTable({
        "sPaginationType": "full_numbers",
        "bJQueryUI": true,
      });
   });
});
    
function GoToProfile(user) {
  window.location.href = "/profile/"   user;
} 
 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> 

почему GoToProfile функция не работает, когда я нажимаю на имя пользователя?. я ставил его в разные положения, внутри $(document).ready , снаружи и так далее, но ничего не получалось.

Комментарии:

1. Вероятно, вы получаете синтаксические ошибки в консоли браузера.

2. После исправления синтаксических ошибок измените: .attr({ 'onclick': 'GoToProfile(' user.username ')' } на: .on('click', function(){GoToProfile(ser.username);})

Ответ №1:

Я бы рекомендовал такой подход, хотя остальная часть кода написана не очень хорошо. Я не проверял это, но это должно сработать.

 $(document).ready(function () {
  function GoToProfile(user) {
    window.location.href = "/profile/"   user;
  }
  $.ajax({
    url: 'paging',
    type: 'GET'
  }).success(function (data) {
    $('#pagination').empty();
    $.each(data, function (index, user) {
      $('#pagination').append($('<tr>')
        .append($('<td>').append($(`<a data-username="${user.username}">`).text(user.username)))
        .append($('<td>').text(user.email)))
      });

      $("#sales").dataTable({
        "sPaginationType": "full_numbers",
        "bJQueryUI": true,
      });
   });
  $("#pagination").on("click", "a", function(){
    const $this = $(this);
    GoToProfile($this.attr(data-username));
  });
});
 

Ответ №2:

как сказал Скотт Маркус:

 attr({'onclick': 'GoToProfile('   user.username   ')'}) 
 

должно измениться на

 on('click', function(){GoToProfile(user.username)})
 

запутанный момент заключается в том, что я использовал точно такой же синтаксис для своих ссылок в других местах проекта, и они работали отлично. я просто не знаю, почему это здесь не сработало!