当尝试通过链接加载内容时，Jquery load不工作，而是重定向而不是更新

Jquery load isn't working when trying load content through a link, redirects instead of updating

本文关键字：Jquery load 更新 工作 重定向 链接 加载      更新时间：2023-09-26

我想使用链接来设置div中的内容

我的HTML代码:

<head>
  <script src="http://code.jquery.com/jquery-1.9.1.js" type="text/javascript"></script>
</head>
<body>
<a href="dashboard.html">dashboard</a>
<a href="basic-info.html">basic-info</a>
<div id="content"></div>

<script src="scripts/links.js" type="text/javascript"></script>
</body>
</html>

My JS Code:

//inside of links.js 
// JavaScript Document
$(document).ready(function() {
    $('#content').load("dashboard.html");
});

您需要将事件侦听器绑定到链接，并且还需要防止如下默认操作:

$(document).ready(function() {
    $('a').on('click', function(e) {
        e.preventDefault();//prevents following the link
        $('#content').load( this.href );
    });
});

您正在点击指向另一个文件的链接，因此浏览器正在尝试重定向到该文件。

你需要阻止链接的默认行为，并使用它作为JS触发器，用Ajax加载内容。

$('a').click(function(event) {
  event.preventDefault();
  var url = $(this).attr('href');
  $('#content').load(url);
  return false; 
});
相关文章：