Браузер не распознает код javascript / jquery

Question

Браузер не распознает код javascript / jquery

0

Я пытаюсь запустить следующий код в Firefox 27.0.1 и Chrome 30.0.1599.114 на машине с Kubuntu Linux, и ничего не происходит.

Страница html является частью веб-приложения на основе Spring MVC framework и помещена в папку WEB-INF/jsp. Кто-то может найти любую ошибку в коде ниже?

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <title>HorarioLivre</title>

  <script src="http://code.jquery.com/jquery-2.1.0.min.js"></script>
  <script>
  $('a').click(function() {
      alert("clicou em um link");
  });
  </script>

  <link rel="stylesheet" href="css/style-main.css">
  <link rel="stylesheet" href="css/style-popup.css">
</head>
<body>
  <header>
    <div class="container">
      <h1><a href="#">HorarioLivre</a></h1>
      <nav>
        <ul>
          <li><a href="listagem_evento.html" class="icon evento">Eventos</a></li>
          <li><a href="cadastra_horario.html" class="icon horario">Cadastrar Horarios</a></li>
          <li><a href="listagem_horario.html" class="icon horario">Listar Horarios</a></li>
          <li><a href="listagem_usuario.html" class="icon usuario">Usuarios</a></li>
          <li><a href="#">${usuario.nome}</a>
            <ul>
                <li><a href="usuario_perfil.html" class="icon perfil">Perfil</a></li>
                <li><a href="usuario_config.html" class="icon settings">Configura&ccedil;&otilde;es</a></li>
                <li><a href="#">Logout</a></li>
            </ul>
          </li>
        </ul>
      </nav>
    </div>
  </header>
  <div id="results">
        <a href="#" id="close">Fechar</a>
        <div id="content"></div> 
  </div>
</body>
</html>

Kleber Mota 03 март 2014, в 18:08

Источник

Теги:

javascript

jquery

html

3 ответа

3

Вы не говорите, что такое ваши "ошибки", но я предполагаю, что вы оставили обработчик документа, поэтому к тому времени, когда ваш селектор запущен, элементы еще не готовы в DOM.

$(function() {
  $('a').click(function() {
      alert("clicou em um link");
  });
});

Utkanos 03 март 2014, в 15:13

1

Вам необходимо обернуть свой код внутри готового обработчика DOM $(document).ready(function() {....}) или более короткой формы $(function() {.... }) чтобы убедиться, что все ваши элементы правильно добавлен в DOM перед выполнением кода jQuery.

$(function() {
    $('a').click(function() {
        alert("clicou em um link");
    });
});

Felix 03 март 2014, в 15:40

Ещё вопросы

Quentin · Accepted Answer · 2014-03-03T14-49-00.000Z

Вы выбираете все элементы, которые существуют на момент выполнения сценария (все нулевой из них, так как скрипт работает в a head и все a существуют элементы в организме) и делать вещи для них.

Переместите скрипт непосредственно перед </body> или создайте функцию и запустите ее в DOM.

jQuery(function () {
    $('a').click(function() {
        alert("clicou em um link");
    });
});

... тогда будет фактической a элементы, которые вы можете манипулировать.