Fatal编程技术网
  • node.js/
  • Node.js 如何在ejs文件成功输出时添加sweetalert？

Node.js 如何在ejs文件成功输出时添加sweetalert？

node.js

Node.js 如何在ejs文件成功输出时添加sweetalert？,node.js,ejs,sweetalert,Node.js,Ejs,Sweetalert,我有一个nodejs文件，它渲染了一个ejs文件，我需要在成功渲染时显示一个ssweet警报？目前我收到一个错误，显示“警报未定义” 这是我的EJS COE <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title></title> <link rel='stylesheet' href='cdnjs.cloudflare.co

我有一个nodejs文件，它渲染了一个ejs文件，我需要在成功渲染时显示一个ssweet警报？目前我收到一个错误，显示“警报未定义” 这是我的EJS COE

<!DOCTYPE html> 
<html lang="en"> 
<head> 
<meta charset="UTF-8"> 
<title></title> 
<link rel='stylesheet' href='cdnjs.cloudflare.com/ajax/…'> 
<link rel="stylesheet" href="/css/style.css" type="text/css"> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script> 
<script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js"></script> 
</head> 
<body> 
<div class="verify"> 
<form id="checkForm" method="post" action="/verify"> 
<label for="verify"><b>Verify</b></label> 
<input type="text" placeholder="Register no" name="emply_id" required> 
<button type="submit" class="signupbtn">Check In</button> 
</form> 
</div> 
<!--<form id="signp" method="get" action="/signup"> 
<button type="submit" class="signupbtn" >Signup</button> 
</form>--> 

<div class="container" id="container"> 
<div class="form-container sign-up-container"> 
<form id="signupForm" method="post" action="/signup"> 
<h1>Create Account</h1> 
<div class="social-container"> 
<a href="#" class="social"><i class="fab fa-facebook-f"></i></a> 
<a href="#" class="social"><i class="fab fa-google-plus-g"></i></a> 
<a href="#" class="social"><i class="fab fa-linkedin-in"></i></a> 
</div> 
<span>or use your email for registration</span> 
<input type="text" placeholder="Company Name" name="name"required/> 
<input type="email" placeholder="Email" name="email" required/> 
<input type="password" placeholder="Password" name="psw" required/> 
<input type="password" placeholder="Re-Password" name="pswrepeat" required/> 
<input type="address" placeholder="Addresss" name="address" required/> 

<button id="myButton">Sign Up</button> 
</form> 
</div> 
<div class="form-container sign-in-container"> 
<form id="loginForm" method="post" action="/login"> 
<h1>Sign in</h1> 
<div class="social-container"> 
<a href="#" class="social"><i class="fab fa-facebook-f"></i></a> 
<a href="#" class="social"><i class="fab fa-google-plus-g"></i></a> 
<a href="#" class="social"><i class="fab fa-linkedin-in"></i></a> 
</div> 
<span>or use your account</span> 
<h1>Log in </h1> 
<hr> 
<label for="email"><b>email</b></label> 
<input type="text" placeholder="Email" name="email" required > 
<label for="password"><b>password</b></label> 
<input type="text" placeholder="Enter Password" name="password" required> 
<button type="submit" class="signupbtn">Log in</button> 
</form> 
</div> 

<div class="overlay-container"> 
<div class="overlay"> 
<div class="overlay-panel overlay-left"> 
<h1>Welcome Back!</h1> 
<p>To keep connected with us please login with your personal info</p> 
<button class="ghost" id="signIn">Sign In</button> 
</div> 
<div class="overlay-panel overlay-right"> 
<h1>Hello, Friend!</h1> 
<p>Enter your personal details and start journey with us</p> 
<button class="ghost" id="signUp">Sign Up</button> 
</div> 
</div> 
</div> 
</div> 


<script src="/js/index.js"></script> 

<script> 

$(document).ready(function () { 
if ("<%= alert %>" === "true") { 
var alertTitle = "<%= alertTitle %>" 
var alertMessage = "<%= alertMessage %>" 
swal(alertTitle, alertMessage, "error"); 
} 
}) 





</script> 


</body> 
</html>
我使用过这种方法，这种标记方法在html中工作得很好，但在js中，它完全是一团糟。

在
app中传递参数。当将页面呈现为字符串时，render
将可用。这在
标记中也可用。您的代码如下所示：

<!DOCTYPE html>
<html lang="en">
  <head>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.0/jquery.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/sweetalert/2.1.2/sweetalert.min.js"></script>
  </head>
  <body>
    <script type="text/javascript">
      $(document).ready(function () {
        if ("<%= alert %>" === "true") {
          var alertTitle = "<%= alertTitle %>"
          var alertMessage = "<%= alertMessage %>"
          swal(alertTitle, alertMessage, "error");
        }
      })
    </script>
  </body>
</html>


$（文档）.ready（函数（）{
如果（“=”真“）{
var alertTitle=“”
var alertMessage=“”
swal（警报标题、警报消息、“错误”）；
}
})
有几件事需要注意：

  • 避免使用保留的JS关键字，如
    警报
    ，这只会让你头疼，而且随着代码库的增长，会出现看不见的bug

  • 您正在使用正确的语法访问行中除if条件之外的所有变量

    • 尝试将此更改为：

    if(<%= alert === true %>) {

    if（）{
    你把它包括在你的html文件中了吗？例如，
    我正在更新我的答案以显示整个html文件。一切都很好，但警报没有等待，因为ejs文件正在加载。我刚刚意识到你正在使用ejs。请重新发布
    {}
    使用
    它会工作的。我正在更新我的答案。没有……仍然没有……没有错误……没有SWALits说没有定义警报您的呈现调用呈现的页面是否正确？如果您上面提供的代码是正确的，那么“警报”应该定义为一个变量。您可以包含更多的代码以及您在控制台中看到的内容吗nd构建？ 
    if (alert === true) {

    if(<%= alert === true %>) {