正是当我单击按钮重新加载页面时出现的问题,解决方案是使用 preventDefault()
但因为“输入控制未正确执行,或者如果模式是不满意不出现任何错误
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
<script>
$('#go').click(function(event) {
//event.preventDefault();
var use = $('#Username').val();
var passwor = $('#Password').val();
alert("Hi);
// Ajax request here
});
</script>
<div class="container">
<div class="card"></div>
<div class="card">
<h1 class="title">Login</h1>
<form>
<div class="input-container">
<input type="text" id="Username" required="required" pattern=".{4,}" title="Devi inserire almeno 4 caratteri"/>
<label for="Username">Username</label>
<div class="bar"></div>
</div>
<div class="input-container">
<input type="password" id="Password" required="required" pattern=".{4,}" title="Devi inserire almeno 4 caratteri"/>
<label for="Password">Password</label>
<div class="bar"></div>
</div>
<div class="button-container">
<button id="go" ><span>Login</span></button>
</div>
</form>
</div>
</div>
最佳答案
删除 src="jquery-1.11.3.min.js"它应该可以工作。 如果您必须添加 jquery 库,请给它一个单独的 scrip 元素。
<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.0.2/jquery.min.js"></script>
<link href="style.css" rel="stylesheet" />
<script src="script.js"></script>
</head>
<body>
<div class="container">
<div class="card"></div>
<div class="card">
<h1 class="title">Login</h1>
<form>
<div class="input-container">
<input type="text" id="Username" />
<label for="Username">Username</label>
<div class="bar"></div>
</div>
<div class="input-container">
<input type="password" id="Password" />
<label for="Password">Password</label>
<div class="bar"></div>
</div>
<div class="button-container">
<button id="go" ><span>Login</span></button>
</div>
</form>
</div>
</div>
<script>
$('#go').on('click',function(e){
var username=$("#Username").val();
var password=$('#Password').val();
e.preventDefault();
alert('Hi');
//write ajax code here
});
</script>
<!-- language: lang-html -->
</body>
</html>
听说是骗子链接:- http://plnkr.co/edit/FmdXu6YixLjlaYerLHFa?p=preview
关于javascript - 避免按下按钮时重新加载页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/34595645/