2014-03-03 38 views
0

我尝试在使用Kubuntu Linux的机器上运行Firefox 27.0.1和Chrome 30.0.1599.114中的以下代码,结果没有任何反应。浏览器无法识别javascript/jQuery代码

html页面是基于Spring MVC框架的Web应用程序的一部分,并放置在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> 

回答

1

您选择所有存在的脚本运行的时候(他们的全部零,因为剧本在head运行,所有的a元素在体内存在)的a元素和做的东西给他们。

将脚本移动到</body>之前,或创建一个函数并在DOM就绪状态下运行它。

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

...然后会有实际的a元素,你可以操纵。

1

你需要用DOM准备处理$(document).ready(function() {....})或较短的形式$(function() {.... })内部代码执行jQuery代码之前,为了确保所有的元素都正确添加到DOM。

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

你不会说你的“错误”是什么,但我的猜测是你遗漏了文档就绪处理程序,所以当你的选择器运行时,DOM中的元素还没有准备好。

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