如何根据表单输入值显示或隐藏 div。特别是如果它的价值是积极的。我希望它显示一个 div。否则我希望它显示另一个 div。
这是我真正想要的更复杂的东西。如果 form1 大于 10,000 而 form2 小于零。显示第一个 div(如果两者都满足)。如果满足表格 1 的条件并且不满足表格 2(表格 2 为正数),则显示第二个 div。如果其他任何内容(均不满足或不满足表格 1(9000)但表格 2 是(负数)显示第三个 div
如何根据表单输入值显示或隐藏 div。特别是如果它的价值是积极的。我希望它显示一个 div。否则我希望它显示另一个 div。
这是我真正想要的更复杂的东西。如果 form1 大于 10,000 而 form2 小于零。显示第一个 div(如果两者都满足)。如果满足表格 1 的条件并且不满足表格 2(表格 2 为正数),则显示第二个 div。如果其他任何内容(均不满足或不满足表格 1(9000)但表格 2 是(负数)显示第三个 div
让我们假设您对 div 有以下内容:
<div class="show_when_more">
Foo
</div>
<div class="show_when_less">
Bar
</div>
以及您想要观看的以下输入:
<input type="text" class="to_watch"/>
然后下面的 Javascript 会为你做这件事(你需要 jquery 才能工作):
$('input.to_watch').on('change', function(){
if($(this).val()>=1000){
$('div.show_when_more').css('display', 'block');
$('div.show_when_less').css('display', 'none');
} else {
$('div.show_when_more').css('display', 'none');
$('div.show_when_less').css('display', 'block');
}
});
这也适用于任何其他类型的选择器(例如,按 id、按元素类型等)
我认为您正在寻找以下内容:
$(function() {
if(isNaN(parseInt($("#in").val())))
{
$("#divtobeshown").show();
}
else {
$("#divtobehidden").hide();
}
});
<form id="sform">
<input value="" id="in" >
</form>
JSFIDDLE上的一个简单说明
这是逻辑。只适用于您的项目。
var value = document.getElementById('input').value;
if(value === 1000) {
//show the first div
}
else {
//show the second div
}
如果您想查看它是否是肯定的,您可以检查它是否 >= 0(或 1,取决于您的目标)。
在对数字进行检查时,最好先对其进行 parseint() 。
将其放入 if 语句中:
if (value >= 0) { then show one div } else { show a different div }