Question

我有两个简单的html文件，其中包含正文链接和JavaScript日志。在A.html中，它是一个跳转到B.html的链接和JavaScript中的console.log("a 123");。但是，只有在刷新浏览器但不从链接执行时才会显示“a 123”消息。例如，如果我点击b.html中的链接Go to a，则不会显示消息“a 123”。

有什么想法吗？

----- ------- A.html

<!DOCTYPE html> 
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='https://fonts.googleapis.com/css?family=Roboto:400,300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<style>

</style>
</head>

<body>
<div data-role="page" id="a">

  <div data-role="main" class="ui-content">
    <a href='b.html'>Go to b</a>
  </div>

</div> 


<script>
console.log("a 123");

</script>

</body>
</html>

----- ------- B.html

<!DOCTYPE html> 
<html>
<head>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href='https://fonts.googleapis.com/css?family=Roboto:400,300' rel='stylesheet' type='text/css'>
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.css">
<script src="http://code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.4.5/jquery.mobile-1.4.5.min.js"></script>
<style>

</style>
</head>

<body>
<div data-role="page" id="b">

  <div data-role="main" class="ui-content">
    <a href='a.html'>Go to a</a>
  </div>


</div> 


<script>
console.log("b 123");

</script>

</body>
</html>

Answer 1

有点搜索，我找到了答案！显然它是Jquery Mobile的“功能”。它使用的是Ajax导航系统。所以它保持单页。

来自docs：

jQuery Mobile包含一个导航系统，可通过Ajax将页面加载到DOM中，增强新内容，然后显示具有丰富动画过渡的页面。导航系统使用渐进式增强功能自动“劫持”标准链接并形成提交，并将其作为Ajax请求进行路由。

阅读jQuery mobile的介绍可能是个好主意：http://demos.jquerymobile.com/1.4.5/intro/

Answer 2

那是因为您的代码仅在页面加载时执行的代码。如果要在事件上执行它，则需要将其包装在函数中并在链接的onclick属性中调用该函数。

当从链接

2 个答案: