我正在检查表单中的每个必填字段。我尝试过这个方法,但它只对第一个输入有效。我如何使它对每个输入都有效?
if($('[required]').val() != ''){
$('.button1').fadeIn(0);
$('.button2').fadeOut(0);
}else{
$('.button1').fadeOut(0);
$('.button2').fadeIn(0);
}
EDIT:对于更多的上下文,这里有另一个函数,我在下面这个应用时,他们改变和HTML代码。
$('[required]').change(function() {
if($('[required]').val() != ''){
$('.button1').fadeIn(0);
$('.button2').fadeOut(0);
}else{
$('.button1').fadeOut(0);
$('.button2').fadeIn(0);
}
});
超文本标记语言
我有一堆这样的输入:
<input type="text" id="title" name="title" value="" required>
<input type="text" id="size" name="size" value="" required>
<input type="text" id="length" name="length" value="" required>
按钮:
<a class="button1" style="display:none" >button 1</a>
<a class="button2">button 2</a>
因此,我想检查空字段时,它的网页加载和每当他们改变。
顺便说一句,我没有一个形式标签,因为它是为移动的,并不认为这是真的有必要,如果这有什么不同。
再次感谢!
6条答案
按热度按时间qlzsbp2j1#
这个?
其中
yourForm
是对FORM元素的引用(您也可以在这里使用选择器)。这是上下文-您只想搜索表单 * 内部 * 的字段。i7uaboj42#
“change”事件适用于SELECT框和RADIO按钮元素,但不适用于INPUT元素。您必须使用“focus/blur”事件来处理输入字段,在您的情况下,“blur”事件非常适合。
如果您想使用jQuery处理许多元素,那么最好使用基于类的操作,在您的情况下,只需为所有输入字段添加一个相同的类“required”,并使用该类对这些字段进行操作。
我已经调整了你的代码块,我上面指定的,检查他们一次,然后让我知道,如果更新的代码也不适合你,更新代码块是:
HTML代码
JS代码
您也可以直接检查工作代码here。
nr7wwzry3#
使用
each()
函数(doc):2w2cym1i4#
您需要获取每个元素的值,如果所有元素都不为空,则执行第一项操作,如果任何元素为空,则执行第二项操作,对吗?
[未测试]
ddarikpa5#
简单,对于添加的度量,添加红色边框
先做一个样式
然后是一个简单的Javascript
kse8i1jr6#
这是我的代码