我正在尝试通过jQuery验证HTML表单。但是,第二个条件(即文本字段的值必须是一定数量)似乎不起作用。如果有人能说明原因,那就太好了。谢谢。
我已将代码附加到此问题。
$("#sample1").keyup(function (e) {
var s_id = $('#sample1').val();
if (e.keyCode == 13 || s_id=="220764690") {
alert('Captured Enter !')
// Do whatever you need
}
});
h1{
text-align:center;
font-family: 'Montserrat', sans-serif !important;
}
.sample1{
text-align: center;
}
.insert {
display: inline-block;
}
.log{
background-color:lightblue;
display: inline-block;
padding:90px;
vertical-align: middle;
}
.logo{
display: block;
margin: 0 auto;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script><link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link rel="stylesheet" href="https://storage.googleapis.com/code.getmdl.io/1.0.0/material.amber-pink.min.css" />
<script src="https://storage.googleapis.com/code.getmdl.io/1.0.0/material.min.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<center><div class = "log">
<h1>Hey Technite!</h1>
<center>
<form action="#">
<div class="insert mdl-textfield mdl-js-textfield textfield-demo">
<input class="mdl-textfield__input" type="text" id="sample1" />
<label class="mdl-textfield__label" for="sample1" id= "atext">Student ID</label>
</div>
</form>
</center>
</div>
</center>
<br><br><br><br><br>
<img src = "https://qph.fs.quoracdn.net/main-qimg-00f778bc5f5fcb5d79a0372986ab1e66.webp" class = "logo">
答案 0 :(得分:2)
尝试使用&&
运算符代替||
。如果确实如此,你可以得到两种条件。
$("#sample1").keyup(function (e) {
var s_id = $('#sample1').val();
if (e.keyCode == 13 && s_id=="220764690") {
alert('Captured Enter !')
// Do whatever you need
}
});
答案 1 :(得分:0)
您的if
条件没有错误,而不是||
您需要使用&&
才能检查用户是否输入了enter
密钥和220764690 input
1}}。
$("#sample1").keyup(function (e) {
var s_id = $('#sample1').val();
if (e.keyCode == 13 && s_id=="220764690") {
alert('Captured Enter !')
// Do whatever you need
}
});
h1{
text-align:center;
font-family: 'Montserrat', sans-serif !important;
}
.sample1{
text-align: center;
}
.insert {
display: inline-block;
}
.log{
background-color:lightblue;
display: inline-block;
padding:90px;
vertical-align: middle;
}
.logo{
display: block;
margin: 0 auto;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script><link href="https://fonts.googleapis.com/css?family=Montserrat" rel="stylesheet">
<link rel="stylesheet" href="https://storage.googleapis.com/code.getmdl.io/1.0.0/material.amber-pink.min.css" />
<script src="https://storage.googleapis.com/code.getmdl.io/1.0.0/material.min.js"></script>
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
<center><div class = "log">
<h1>Hey Technite!</h1>
<center>
<form action="#">
<div class="insert mdl-textfield mdl-js-textfield textfield-demo">
<input class="mdl-textfield__input" type="text" id="sample1" />
<label class="mdl-textfield__label" for="sample1" id= "atext">Student ID</label>
</div>
</form>
</center>
</div>
</center>
<br><br><br><br><br>
<img src = "https://qph.fs.quoracdn.net/main-qimg-00f778bc5f5fcb5d79a0372986ab1e66.webp" class = "logo">
答案 2 :(得分:0)
如果您希望在拥有该ID时显示警报,请按Enter键,您需要使用&amp;&amp;运算符,而不是||