Question

我有一个html页面，在头部我引用了js文件

<head>
   <script src="/queue.js"></script>
</head>

在身体中我有一个链接

<a href="#" onclick="get_ajax()">click me</a>

js文件如下（使用jQuery）

function get_ajax(){
    $.get("/queue/get_ajax", function(data){
       $("#div_id").html(data);
    });
}

点击链接不会触发js功能，但重新加载页面会使其正常工作。

问题是由我引用js文件引起的吗？

这是rails 4应用程序的页面。

完整的头像

 <head> 
<title>XXXX</title> 
<meta name="viewport" content="width=device-width, initial-scale=1"> 
<link rel="stylesheet" href="jquery/jquery.mobile-1.2.1.min.css" />
<link rel="stylesheet" href="my.css" />
    <script src="/queue.js"></script>
<script src="jquery/jquery-1.8.3.min.js"></script>
<script src="jquery/jquery.mobile-1.2.1.min.js"></script>
  </head>

当我在浏览器中检查页面源代码时，我发现生成的html页面没有包含<script src="/queue.js"></script>

Answer 1

试试这个

更改js文件的顺序（首先是库）

<script src="jquery/jquery-1.8.3.min.js"></script>
<script src="/queue.js"></script>

然后

<a href="javascript:void(0)" onclick="get_ajax()">click me</a>

Answer 2

而不是：

<a href="#" onclick="get_ajax()">click me</a>

使用此：

<a href="javascript:void(0)" onclick="get_ajax()">click me</a>

javascript：void（0）将停止重新加载页面。

Answer 3

为防止页面重新加载，您也可以这样做：

<a href="#" onclick="get_ajax(event)">click me</a>

function get_ajax(e) {
    e.preventDefault();
    $.get("/queue/get_ajax", function(data){
        $("#div_id").html(data);
    });
}

Answer 4

在包含jquery之前，你要包含使用jquery的js文件。因此，在解析queue.js时，页面不知道你在说什么。

首先包括jquery然后是queue.js，它应该可以解决问题。

用于单击链接的javascript不起作用，但在重新加载页面后起作用

4 个答案: