如果輸入值等於特定文本，則顯示div

我正在慢慢地學習jQuery，所以請原諒我的無知。我做了很多Google搜索，結果在下面的Frankenstein例子中。如果輸入值等於特定文本，則顯示div

在這個例子中，如果用戶輸入「Kasey」到input，我想div＃pete有display:block。

提前致謝！

<!DOCTYPE html> 
<html> 
<head> 

<script> 
$(document).ready(function(){ 
var val = $("#fname").length; 
if (val = Kasey) { 
     $("#pete").css("display", "block"); 
    } 
</script> 
</head> 
<body> 

<p>Name: <input type="text" id="fname"></p> 
<p id="pete" style="display:none;" >Pete</p> 

</body> 
</html>

來源

2014-03-01 user3367388

您可以使用keyup()處理程序以偵聽keyup事件。內部使用this.value來獲取值

$(document).ready(function() { 
    $("#fname").keyup(function() { 
     if (this.value == "Kasey") { 
      $("#pete").css("display", "block"); 
     } 
     else { 
      $("#pete").css("display", "none"); 
     } 
    }); 
});

FIDDLE

UPADATE：

您可以簡化代碼如下

$(document).ready(function() { 
    $("#fname").keyup(function() { 
     $("#pete").css("display", this.value == "Kasey" ? "block" : "none"); 
    }); 
});

來源

2014-03-01 05:45:10

做這個改變對你的代碼

添加val()用於獲取元素
使用==運營狀況
比較字符串，你應該添加引號像「凱西」

注的價值：如果u要做到這一點的形式加載代碼如下喜歡或添加keyup()事件

<script> 
$(document).ready(function(){ 
var val = $("#fname").val(); 
if (val == 'Kasey') { 
     $("#pete").css("display", "block"); 
    } 
}); 
</script>

來源

2014-03-01 05:59:06 chriz

的問題是，你的˚F當文檔加載時，unction正在讀取fname的值，而不是在用戶輸入之後。此外，要指定長度爲val時，你應該

var val = $("#fname").val();

最後分配值的if語句需要等於運營商，是==

if (val == 'Kasey')

來源

2014-03-01 06:00:16 khaos337

如果輸入值等於特定文本，則顯示div

回答

相關問題