JQuery get方法似乎不起作用

我一直在寻找一种方法在每个页面上获得相同的导航栏。现在，我有一个加载到每个页面上的jQuery脚本，它应该替换一个div占位符;但是，当我运行该程序时，导航栏根本就不存在。JQuery get方法似乎不起作用

jQuery代码：

$(function() { 
$("#dropdown").hover(function() { 
    $("#submenu").stop(); 
    $("#submenu").slideToggle(500); 
}); 

$("#submenu").hover(function() 
{ 
    $("#submenu").stop(); 
    $("#submenu").slideToggle(500); 
}); 

$.get("navigation.html", function(data){ 
    $("#nav-placeholder").replaceWith(data); 
}); 
});

导航文件：

<nav> 
<a href = "index.html">CV Game Development</a> 
<div class="menu"> 
    <div id="dropdown">Tutorials</div> 
     <div id="submenu"> 
      <a href="beginner.html">Beginner</a> 
      <a href="intermediate.html">Intermediate</a> 
      <a href="advanced.html">Advanced</a> 
     </div> 
    </div> 
</div> 
</nav>

实际的HTML文件中使用：

<html> 
<meta charset="utf-8"> 
<meta name="viewport" content="width=device-width"> 
<link rel="stylesheet" type="text/css" href="main.css"> 
<script src="https://code.jquery.com/jquery-3.1.1.js"></script> 
<script src="main.js"></script> 
<head> 
    <title>CV Game Development</title> 
    <div id = "nav-placeholder"></div> 
</head> 
<body> 
    <h1 id = "intro">Welcome</h1> 
    <h3 id = "subintro">to the CV Game Development website</h3> 

    <p id = "info">Here is an abundance of information to get you started making 2D games with GameMaker: Studio.</p> 
</body> 
</html>

好像它应该工作，然而，这不是“T。任何帮助非常感谢，谢谢！

来源

2017-06-13 Keto Z

是什么在你的JS控制台？你采取了哪些调试步骤？ –

为什么你的'

'里面'' –

你应该使用'.load（）'而不是发出异步请求：https://stackoverflow.com/questions/1246137/ajax-jquery-load-versus-jquery-得到。p/s：在附注中，使用jQuery对于您的问题确实是一个非常糟糕的解决方案：改为使用模板系统（您甚至不需要CMS来完成此任务）。杰基尔是一个好开始。 – Terry

：给<nav>一个id为

<nav id="nav">

第二：您可以使用代替.get() ..而代码应该看起来像

$('#nav-placeholder').load("navigation.html #nav");

以上代码将包装为<nav id="nav"> int Ø<div id="nav-placeholder">

：如果您需要您更换可以使用unwrap()代替..所以你的代码应该是这样的

$('#nav-placeholder').load("navigation.html #nav" , function(){ 
    $('#nav').unwrap(); 
});

第四：我还不知道为什么你<div id = "nav-placeholder"></div>里面<head>但我的任何测试方式，它的代码将工作，即使它包装到<head> ..

来源

2017-06-13 19:00:31

由于穆罕默德·优素福在评论注意到你已经把你的资产净值，占位符DIV元素头标签，这是它错了地方。它应该在内部元素内。

而且你元，CSS和脚本标签必须在头元素。

<html> 
 

 
<head> 
 
    <title>CV Game Development</title> 
 
    <meta charset="utf-8"> 
 
    <meta name="viewport" content="width=device-width"> 
 
    <link rel="stylesheet" type="text/css" href="main.css"> 
 
    <script src="https://code.jquery.com/jquery-3.1.1.js"></script> 
 
    <script src="main.js"></script> 
 
</head> 
 

 
<body> 
 
    <div id="nav-placeholder"></div> 
 
    <h1 id="intro">Welcome</h1> 
 
    <h3 id="subintro">to the CV Game Development website</h3> 
 

 
    <p id="info">Here is an abundance of information to get you started making 2D games with GameMaker: Studio.</p> 
 
</body> 
 

 
</html>

来源

2017-06-13 19:17:25 lev09

JQuery get方法似乎不起作用

回答

相关问题