Question

我一直在制作一个有很多页面的网站。因此决定将导航栏放在一个单独的php文件中，以减少所有这些页面的重新工作，以防万一。所以在我的index.php我已经包含了导航栏，如：

<?php include 'navbar.php'; ?>

navbar.php看起来像：

<div id="nav"> 
<ul>
<li pg="#home" >home</li>
<li pg="#pack" >packages</li>
<li pg="#about" >about</li>
</ul> 
</div>

在index.php中，我有一个javascript onClick函数从导航栏中选择<li>：

<script type="text/javascript">
var oldpg = "#home";
$(document).ready(function() {
$('#nav ul li').click(function() {
//here are the codes to hide/show divs });

});
</script>

但是当你点击那些<li>时没有任何反应。我认为js没有从php中获取元素。如何在单独的php文件中引用这些元素？

Answer 1

使用on然后尝试。没有测试，但这可能是这里的问题。尝试

$(document).ready(function() {
 $(document).on('click', '#nav ul li', function(e) {
  //Your code
 });
});

还要确保包含jQuery库

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

Answer 2

您向我们展示的代码是正确的。只要确实显示了带有“nav”的div，请确保正确包含jQuery库。如果是，则您的错误必须位于内部点击事件处理程序$.click（在//here are the codes to hide/show divs中）内。

Answer 3

您需要修复JavaScript：

$(document).ready(function() {
  $('#nav ul li').click(function() {
  //here are the codes to hide/show divs });

  });
}); // you left off this closing

您可以使用Chrome DevTools或Firebug查看控制台。

Answer 4

感谢您回复@Retsam @Campari @Chris @Ankit

正如@Retsam所说，我尝试使用Chrome控制台，发现错误 Uncaught reference error: $ not defined（Firebug控制台没有给出任何错误/消息）原因是因为我在链接jQuery库之前已经放了我的代码。所以我动了我的

<script src="scripts/jquery-1.3.2.min.js" type="text/javascript"></script>

在onClick函数之上，并且有效。

傻傻的我......

谢谢你们

使用Javascript从包含的PHP中选择一个元素

4 个答案: