[英]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.