[英]Keyup is not working
$(document).ready(function() { $("#age").keyup(function() { var dInput = $('#age').val().replace(/,/g, ""); console.log(dInput); if (dInput > 1) { console.log("in"); $(".fStep2").css("display", "block"); } else { $(".fStep2").css("display", "none"); } }); $("#age").blur(function() { var dInput = parseInt($('input:text[name=age]').val().replace(/,/g, "")); console.log(dInput); if (dInput > 1) { console.log("in"); $(".fStep2").css("display", "block"); } else { $(".fStep2").css("display", "none"); } }); });
.fStep2 { background-color: orange; height:100px; margin:10px; padding:10px 5px 20px; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <h1>Hello Plunker!</h1> <input type="text" id="age" class="age" name="age"> <div class="fStep2" id="fStep2" style="display:none;"> <input type="text"> <input type="text"> </div>
我正在创建一个页面,我在其中创建了输入类型text和div。 我希望仅当文本框中的值大于1时才显示div。但是我的div没有显示。 我创建了一个函数。 但没有解决问题。这是我的代码。
$(document).ready(function() { $("#age").keyup(function() { var dInput = $('#age').val().replace(/,/g, ""); console.log(dInput); if(dInput > parseInt("1")){ console.log("in"); $(".fStep2").css("display","block"); } else{ $(".fStep2").css("display","none"); } }); $("#age").blur(function() { var dInput = parseInt($('input:text[name=age]').val().replace(/,/g, "")); console.log(dInput); if(dInput > parseInt("1")){ console.log("in"); $(".fStep2").css("display","block"); } else{ $(".fStep2").css("display","none"); } }); });
<script type="text/javascript"> </script> <!DOCTYPE html> <html> <head> </head> <body> <h1>Hello Plunker!</h1> <input type="text" id="age" class="age"> <div class="fStep2" id="fStep2" style="display:none;"> <input type="text" > <input type="text" > </div> </body> </html>
您没有加载jquery.js并为文本框分配名称或更改了以下行
var dInput = parseInt($('input:text[name=age]').val().replace(/,/g, ""));
使用以下命令编辑脚本
$(document).ready(function() {
$("#age").keyup(function() {
var dInput = parseInt($('input:text[name=age]').val().replace(/,/g, ""));
console.log(dInput);
if(dInput > parseInt("1")){
console.log("in");
$(".fStep2").css("display","block");
}
else{
$(".fStep2").css("display","none");
}
});
$("#age").blur(function() {
var dInput = parseInt($('input:text[name=age]').val().replace(/,/g, ""));
console.log(dInput);
if(dInput > parseInt("1")){
console.log("in");
$(".fStep2").css("display","block");
}
else{
$(".fStep2").css("display","none");
}
});
});
尝试更换
$('input:text[name=age]')
与
$("input:text[name='age']")
为了达到预期的效果,请在下面使用
var dInput = $('#age').val().replace(/,/g, "");
console.log(dInput);
代码中唯一的问题是缺少$(document).ready
括号和括号。 “})”。 如果单击“运行代码段”,则会看到脚本错误。 在删除所有脚本并从代码段编辑器添加jQuery之后,我对您的代码段进行了测试。 因此,摆脱掉这里不需要的所有脚本元素,并正确插入jQuery。 用最简单的情况进行测试。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.