javascript - jQuery 函数在 CodePen 中有效,但在 Node.js 服务器中无效

标签 javascript jquery html css node.js

jQuery CSS 按钮过渡动画在 CodePen 中完美运行,但是当在 Node.js 服务器中使用相同的代码时,过渡效果不起作用。

浏览器控制台不会抛出任何错误。

链接到我的 CodePen 分支:

CodePen Link

这是在服务器上运行的相同代码。 服务器 HTML 文件:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Login</title>
<link rel="stylesheet/less" type="text/css" 
href="/css/login_styles.less" />
<script 
src="https://cdnjs.cloudflare.com/ajax/libs/less.js/3.7.1/less.min.js" 
></script> <script 
src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/
jquery.min.js"></script>
<script>
$("#login-button").click(function(event){
event.preventDefault();

$('form').fadeOut(500);
$('.wrapper').addClass('form-success');
});
</script>
</head>
<body>
<div class="wrapper">
     <div class="container">
           <h1>Welcome</h1>
             <form class="form">
                    <input type="text" placeholder="Username">
                       <input type="password" placeholder="Password">
                          <button type="submit" id="login- 
                                button">Login</button>
                        </form>
</div>

<ul class="bg-bubbles">
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>
</div>
</body>

</html>

服务器 CSS Less 文件: 完全从 CodePen 链接复制粘贴

从 Node.js 服务器运行时,除了单击登录按钮时的转换外,一切正常。

任何人都可以找出原因或者这是 jQuery 中的错误吗?

最佳答案

试试 button type="button"... 为我工作

关于javascript - jQuery 函数在 CodePen 中有效,但在 Node.js 服务器中无效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/53184011/

相关文章:

javascript - 将 async/await 与 forEach 循环结合使用

javascript - 找到行中的数字。 JavaScript

jquery - 我应该如何在下拉菜单中设置多个选项卡?

javascript - 基于 Visibility JS Fade In 的 If 语句

html - 服务器端包含和字符编码

javascript - Node.js 中的异常处理程序

javascript - 计算 console.log 对象

javascript - ajax 提交后清除表单值。

php - 如何在字符串中间添加内容?

html - 背景图像未使用 css 显示