Javascript 我的引导淹没菜单没有';ajax提交后无法工作
我有一个简单的登录页面,可以登录用户然后重定向他们,但是我为重置密码页面编写了一个Javascript 我的引导淹没菜单没有';ajax提交后无法工作,javascript,jquery,html,ajax,Javascript,Jquery,Html,Ajax,我有一个简单的登录页面,可以登录用户然后重定向他们,但是我为重置密码页面编写了一个ajax代码,在我输入错误的详细信息和登录页面重新加载后,下拉菜单不起作用。 我尝试使用$('.dropdown toggle').dropdown()功能但它根本不工作 Login.php <?php require_once('./files/functions.php'); require_once('phpmailer/PHPMailerAutoload.php'); ?> &
ajax
代码,在我输入错误的详细信息和登录页面重新加载后,下拉菜单不起作用。
我尝试使用$('.dropdown toggle').dropdown()代码>功能
但它根本不工作
Login.php
<?php
require_once('./files/functions.php');
require_once('phpmailer/PHPMailerAutoload.php');
?>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>log in</title>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<!-- Vendors -->
<!-- Animate CSS -->
<link href="vendors/bower_components/animate.css/animate.min.css" rel="stylesheet">
<!-- Material Design Icons -->
<link href="vendors/bower_components/material-design-iconic-font/dist/css/material-design-iconic-font.min.css" rel="stylesheet">
<!-- Site CSS -->
<link href="css/app-1.min.css" rel="stylesheet">
</head>
<body>
<div class="login">
<!-- Login -->
<div class="login__block toggled" id="l-login">
<div class="login__block__header">
<i class="zmdi zmdi-account-circle"></i>
Hi there! Please Sign in
<div class="actions login__block__actions">
<div class="dropdown">
<a href="#" data-toggle="dropdown"><i class="zmdi zmdi-more-vert"></i></a>
<ul class="dropdown-menu pull-right">
<li><a data-block="#l-register" href="">Create an account</a></li>
<li><a data-block="#l-forget-password" href="#">Forgot password?</a></li>
</ul>
</div>
</div>
</div>
<div class="login__block__body">
<form action="" method="POST">
<div class="form-group form-group--float form-group--centered form-group--centered">
<input type="text" class="form-control" name="email">
<label>Email Address</label>
<i class="form-group__bar"></i>
</div>
<div class="form-group form-group--float form-group--centered form-group--centered">
<input type="password" class="form-control" name="password">
<label>Password</label>
<i class="form-group__bar"></i>
</div>
<button type="submit" name="login" value="Sign In" class="btn btn--light btn--icon m-t-15"><i class="zmdi zmdi-long-arrow-right"></i></button>
</form>
<?php
// some php code for the login process...
?>
</div>
</div>
<!-- Forgot Password -->
<div class="login__block" id="l-forget-password">
<div class="login__block__header palette-Purple bg">
<i class="zmdi zmdi-account-circle"></i>
Forgot Password?
<div class="actions login__block__actions">
<div class="dropdown">
<a href="#" data-toggle="dropdown"><i class="zmdi zmdi-more-vert"></i></a>
<ul class="dropdown-menu pull-right">
<li><a data-block="#l-login" href="#">Already have an account?</a></li>
<li><a data-block="#l-register" href="#">Create an account</a></li>
</ul>
</div>
</div>
</div>
<div class="login__block__body">
<form id="pw">
<p class="m-t-30">Please enter the e-mail address used to register. We will send your new password to that address.</p>
<div class="form-group form-group--float form-group--centered">
<input type="text" class="form-control" name="email" id="emailfield">
<label>Email Address</label>
<i class="form-group__bar"></i>
</div>
<div id="result"></div>
<button class="btn btn--light btn--icon m-t-15" value="submit" type="submit"><i class="zmdi zmdi-check"></i></button>
</div>
</form>
<script type = "text/javascript">
$("form#pw").on("submit", function(e){
e.preventDefault();
var emailfield = $("#emailfield").val();
var email ='email='+ emailfield;
$.ajax({
url: "login.php",
method: "POST",
data: email,
success: function (result) {
alert("result: " + result);
console.log(result);
$("#result").html(result);
$('.dropdown-toggle').dropdown();
}
});
});
</script>
<?php
// php code for the reset password....
?>
</div>
</div>
<!-- Older IE Warning -->
<!--[if lt IE 9]>
<div class="ie-warning">
<h1>Warning!!</h1>
<p>You are using an outdated version of Internet Explorer, please upgrade <br/>to any of the following web browsers to access this website.</p>
<div class="ie-warning__container">
<ul class="ie-warning__download">
<li>
<a href="http://www.google.com/chrome/">
<img src="img/browsers/chrome.png" alt="">
<div>Chrome</div>
</a>
</li>
<li>
<a href="https://www.mozilla.org/en-US/firefox/new/">
<img src="img/browsers/firefox.png" alt="">
<div>Firefox</div>
</a>
</li>
<li>
<a href="http://www.opera.com">
<img src="img/browsers/opera.png" alt="">
<div>Opera</div>
</a>
</li>
<li>
<a href="https://www.apple.com/safari/">
<img src="img/browsers/safari.png" alt="">
<div>Safari</div>
</a>
</li>
<li>
<a href="http://windows.microsoft.com/en-us/internet-explorer/download-ie">
<img src="img/browsers/ie.png" alt="">
<div>IE (New)</div>
</a>
</li>
</ul>
</div>
<p>Sorry for the inconvenience!</p>
</div>
<![endif]-->
<!-- Javascript Libraries -->
<!-- jQuery -->
<script src="vendors/bower_components/jquery/dist/jquery.min.js"></script>
<!-- Bootstrap -->
<script src="vendors/bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
<!-- Placeholder for IE9 -->
<!--[if IE 9 ]>
<script src="vendors/bower_components/jquery-placeholder/jquery.placeholder.min.js"></script>
<![endif]-->
<!-- Site Functions & Actions -->
<script src="js/app.min.js"></script>
</body>
</html>
登录
你好!请登录
电子邮件地址
密码
忘记密码了?
请输入用于注册的电子邮件地址。我们会将您的新密码发送到该地址
电子邮件地址
$(「表格」)。在「提交」上,职能(e){
e、 预防默认值();
var emailfield=$(“#emailfield”).val();
var email='email='+emailfield;
$.ajax({
url:“login.php”,
方法:“张贴”,
数据:电子邮件,
成功:功能(结果){
警报(“结果:+结果”);
控制台日志(结果);
$(“#结果”).html(结果);
$('.dropdown toggle').dropdown();
}
});
});
- 您将包含两次jQuery,一次来自CDN,一次来自本地文件系统。卸下顶部的CDN
- 内联
块在包含其他Javascript资源之前出现。尝试将它放在所有其他JS文件之后,或者更好地放在它可能属于的app.min.JS
中
很难看到确切的问题,因为您的代码中有很多是我们看不到的自定义内容(可能与此问题无关)。以后,请尝试创建一个解决您的问题的方法 可能重复的