Javascript jQuery下拉菜单未初始化
我是新来的，所以我想首先借此机会自我介绍，并向大家问好。：） 问题Javascript jQuery下拉菜单未初始化,javascript,jquery,dropdown,Javascript,Jquery,Dropdown,我是新来的，所以我想首先借此机会自我介绍，并向大家问好。：） 问题 我没有使用jQuery下拉菜单插件，而是尝试编写自己的小jQuery脚本，但就我的一生而言，我似乎无法让它初始化 我的目标是用一个名为wpc menu mobile的类切换/附加wpc menu类。当我手动添加新类时，所有内容似乎都加载良好，这让我相信这是HTML和/或jQuery的问题 如果有人能给我指引正确的方向，我将非常感谢你抽出时间 请参阅下面概述的HTML和jQuery代码 HTML <!DOCTYPE html
我没有使用jQuery下拉菜单插件，而是尝试编写自己的小jQuery脚本，但就我的一生而言，我似乎无法让它初始化 我的目标是用一个名为wpc menu mobile的类切换/附加wpc menu类。当我手动添加新类时，所有内容似乎都加载良好，这让我相信这是HTML和/或jQuery的问题 如果有人能给我指引正确的方向，我将非常感谢你抽出时间 请参阅下面概述的HTML和jQuery代码 HTML
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="UTF-8">
<meta content="width=device-width, initial-scale=1" name="viewport">
<title>Test</title>
<link href='css/style.css' media='all' rel='stylesheet' type='text/css'>
<link href='css/font-awesome.min.css' media='all' rel='stylesheet' type='text/css'>
</head>
<body>
<div>
<nav class="main-navigation">
<div class="container">
<div id="nav-toggle">
<i class="fa fa-bars"></i>
</div>
<ul class="wpc-menu">
<li class="menu-item menu-item-type-post_type menu-item-object-page current-menu-item page_item page-item-6 current_page_item menu-item-698" id="menu-item-698">
<a href="index.html">Home</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-699" id="menu-item-699">
<a href="scaffolding.html">Scaffolding</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-696" id="menu-item-696">
<a href="design.html">Design</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-696" id="menu-item-696">
<a href="health-and-safety.html">Health & Safety</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-696" id="menu-item-696">
<a href="blog.html">Blog</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-696" id="menu-item-696">
<a href="about-us.html">About Us</a>
</li>
<li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-697" id="menu-item-697">
<a href="contact.html">Contact Us</a>
</li>
</ul>
<div class="nav-social" style="margin-left: 2em">
<a href="http://www.twitter.com/" target="_blank" title="Twitter"><i class="fa fa-twitter"></i></a> <a href="https://www.facebook.com/All-Aspects-Scaffolding-160975444254259/" target=
"_blank" title="Facebook"><i class="fa fa-facebook-official"></i></a> <a href="http://www.linkedin.com/" target="_blank" title=
"Linkedin"><i class="fa fa-linkedin-square"></i></a> <a href="https://plus.google.com/103376540762389269428/about" target="_blank" title="Google Plus"><i class=
"fa fa-google-plus"></i></a>
</div>
</div>
</nav>
<div class="clear"></div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
<script src='js/nav.js' type='text/javascript'></script>
</body>
</html>
试验
jQuery(document).ready(function() {
"use strict";
/**
* Initialise Menu Toggle
*/
(function() {
jQuery('.wpc-menu li.menu-item-has-children').each(function() {
jQuery().prepend('<div class="nav-toggle-subarrow"><i class="fa fa-angle-down"></i></div>');
});
jQuery('#nav-toggle').click(function() {
jQuery('.wpc-menu').addClass('wpc-menu-mobile');
if (jQuery().hasClass('nav-toggle-active')) {
jQuery().removeClass('nav-toggle-active');
} else {
jQuery().addClass('nav-toggle-active');
}
});
jQuery('.nav-toggle-subarrow, .nav-toggle-subarrow .nav-toggle-subarrow').click(function() {
jQuery().parent().toggleClass("nav-toggle-dropdown");
});
});
})
();
jQuery（文档）.ready（函数（）{
“严格使用”；
/**
*初始化菜单切换
*/
（功能（）{
jQuery（'.wpc menu li.menu项有子项'）。每个（函数（）{
jQuery（）.prepend（“”）；
});
jQuery（“#导航切换”）。单击（函数（）{
jQuery（'.wpc menu'）.addClass（'wpc-menu-mobile'）；
if（jQuery（）.hasClass（'nav-toggle-active'））{
jQuery（）.removeClass（'nav-toggle-active'）；
}否则{
jQuery（）.addClass（'nav-toggle-active'）；
}
});
jQuery（'.nav toggle subrow，.nav toggle subrow.nav toggle subrow'）。单击（函数（）{
jQuery（）.parent（）.toggleClass（“导航切换下拉菜单”）；
});
});
})
();