PJAX + jQuery模态问题求解

我正在构建这个网页,我希望通过URL的共享功能,可以让news出现在jquery.mode中。我试了试PJAX解决方案,我想把链接放在URL中,并在模态窗口中显示内容。但是在谷歌搜索了几天之后,我无意中发现,如果你点击页面,它会以模式打开,还会显示URL,但我找不到它是如何工作的。以下是链接: http://rigaspots.blogspot.com/

这是我的代码:

<link rel="stylesheet" href="../jquery.modal.css">
<script src="js/jquery-1.7.1.min.js"></script>
<script src="js/jquery.cookie.js"></script>
<script src="js/jquery.pjax.js"></script>
<script src="../js/jquery.modal.js"></script>
<script type="text/javascript">


var direction = "right";
$(document).ready(function(){
$('a').pjax({
container: '.modal'
});

$('.modal').on('pjax:start', function() {
  $(this).addClass('loading')
})

$('.modal').on('pjax:end', function() {
  $(this).removeClass('loading')
})


});


</script>

<style> 

#main {
  font-family:Helvetica,Arial,sans-serif;   
  width:30%;  
  opacity: 1;
  transition: opacity 0.20s linear;
}

#main.loading {
   opacity: 0.5;
}   
h2 {margin-left:200px;}
   ul{padding-left:15px; list-style:none;}
</style> 

</head>
<body>
<p ><strong style='color:green'> 2012-10-25 16:52:13</strong> (Time should only change on     refresh!)</p><div id="main">
<h1>PJAX using PHP</h1>

<ul class='header'>
  <li><a href='trex.php' data-pjax='modal' rel="modal:open">Tyrannosaurus</a></li>
  <li><a href='kong.php' data-pjax='modal' rel="modal:open" >King Kong</a></li>
</ul>
</div>

参考链接http://supervalters.mplab.lv/source/

任何建议都将不甚感激,谢谢!

ChatGPT尝试解决您的问题,仅供参考
您可以使用 jQuery 的 .load() 方法来加载内容。它可以通过指定的 URL 获取内容并加载到您选择的元素中。


例如,您可以使用以下代码来加载内容到模态框中:

$('.modal').load('http://rigaspots.blogspot.com/');

这将从您给出的 URL 获取内容并将其加载到 class 为 modal 的元素中。

此外,您可以使用类似于以下代码的代码来打开模态框:

$('.modal').modal();

请注意,这些代码假设您已经包含了 jQuery 和模态框插件,并且已经通过 link 元素引用了样式表文件。