如何使用文本框中的值动态隐藏div

Question

我正在构建一个网站，我需要能够根据文本框中输入的数字动态隐藏div。

当用户输入“0”时，我需要一个div来隐藏。如果用户输入任何其他号码，我需要显示div。

有办法吗？

我看了很多例子，但它们都是基于排序或使用与我想要的完全不同的过滤器。

任何帮助将不胜感激

Answer 1

以下是一个工作示例JSFiddle

HTML

<div id="myDiv">
    This Div will be hidden when you enter zero.
</div>

<input type="text" id="userInput"/>

JQuery的

$('#userInput').on('input',function(){
    if( $(this).val() == 0 )
        $('#myDiv').hide();
    else
        $('#myDiv').show();
});

说明： .on()用于将一个或多个事件的事件处理函数附加到所选元素。

以下是语法：

.on( events [, selector ] [, data ], handler )

有关此功能的更多详细信息，请参阅JQuery documentation

Answer 2

您可以在change事件中执行此操作。您可以使用 on() 功能来绑定事件。

$('yourInputSelector').on('input',function(){
    if( $(this).val() == 0 )
        $('yourDiv').show();
    else
        $('yourDiv').show();
});