Методы jQuery insertBefore или before не работают

#jquery

#jquery

Вопрос:

Я делаю проект для своей степени. Этот проект является групповым проектом, который предназначен для реализации в школе здесь, в Кейптауне, Южная Африка. Вы можете проверить всю организацию git на GitHub под названием Jewel Systems.

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

Я занят на интерфейсной стороне проекта и не могу заставить работать два метода jQuery. Это работало раньше, не касалось проекта в течение месяца, и сообщения об ошибках просто перестали отображаться. Я проверил консоль на Firebug, она показала сообщение об ошибке с сервера.

Итак, допустим, я нахожусь на экране входа в систему, экран входа в систему выглядит следующим образом: Экран входа в систему

код для login.js скрипта является:

 $(document).ready(function() {

  if (typeof sessionStorage.email != "undefined") {
    window.location = "/user";
  } else {
    // $('.content .loading').fadeIn(1000);
    // $('.content .loading').css('display', 'block');
    // $('.content .loading').delay(2000).fadeOut(1000);
    // $('.content p.greeting').delay(5000).fadeIn(1000);
    // $('.content p.greeting').delay(2000).fadeOut(1000);
    // $('.content .panel').delay(10000).fadeIn(1000);
    // $('.content .panel').fadeIn(1000);
  }

  $('.content .panel').fadeIn(1000);

  $('form.loginForm').submit(function(event) {
    var data = $(this).serializeArray();

    $.ajax({
      url: domain   'testauth',
      type: 'POST',
      data: JSON.stringify({"username": data[0].value, "password" : data[1].value}),
      contentType: 'application/json',
      success: function(result, status, xhr) {
        var user_data = result.data;

        if (typeof(Storage) !== "undefined") {
          sessionStorage.user_id = user_data.id;
          sessionStorage.email = user_data.email;
          sessionStorage.fname = user_data.fname;
          sessionStorage.lname = user_data.lname;
          sessionStorage.user_type = user_data.type;
          sessionStorage.created_at = user_data.created_at;
          $.get(domain   "user/"   user_data.id, function(data) {
            data = data.data;
            if (data.loaned[0] !== undefined) {
              if (data.loaned.length > 1) {
                sessionStorage.device_loaned = data.loaned[0].type   ":"   data.loaned[0].id   "#"   data.loaned[1].type   ":"   data.loaned[1].id;
              } else if (data.loaned.length === 1) {
                sessionStorage.device_loaned = data.loaned[0].type   ":"   data.loaned[0].id;
              }
            } else {
              sessionStorage.device_loaned = null;
            }
            if (data.privileges.length > 1) {
              sessionStorage.perm = data.privileges[0].type   "#"   data.privileges[1].type;
            } else if (data.loaned.length === 1) {
              sessionStorage.perm = data.privileges[0].type;
            }
            window.location = "/user";
          });
        } else {
          $('.error-message').remove();
          var msg = $('<div class="alert alert-danger error-message"></div>').html("<strong>Oh snap!</strong> Your browser doesn't support local storage, please update your browser or download <a href='https://www.google.com/chrome/'>Google Chrome</a>/<a href='https://www.mozilla.org/en-US/firefox/new/'>Mozilla Firefox</a>.");
          $(msg).insertBefore('.panel');
          event.preventDefault();
        }
      },
      error: function(xhr, status, error) {
        try {
          var response = JSON.parse(xhr.responseText);
          $('.error-message').remove();
          var msg = $('<div class="alert alert-danger error-message"></div>').html("<strong>Oh snap!</strong> The email/ID or password entered is incorrect, please try again.");
          // $(msg).insertBefore('.panel');
          $('.panel').before(msg);
        } catch (e) {
          console.log(e);
        }
      },
    });
    event.preventDefault();
  });
});
  

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

Мой веб-сайт размещен на сервере ссылок (репозиторий можно найти в организации Jewel Systems, вам потребуется gradle установить для запуска этого сервера).

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

1. ваш код работает, но, возможно, проблема в чем-то другом, пожалуйста, смотрите здесь пример jsfiddle , и сообщение без $ также работает

2. И хороший способ установить sessionStorage — это sessionStorage.setItem('key', 'value') .

3. @ainasiart почему это лучше? и да, я нашел ошибку в другом файле. Я удалил сообщение об ошибке после остановки ajax.

Ответ №1:

похоже, что ваше сообщение уже является объектом jQuery, возможно, вам придется использовать

msg.insertBefore(‘.panel’);

Ответ №2:

Ошибка была в другом файле, из которого я удалил сообщение об ошибке при возникновении ajaxStop.