我正在尝试将焦点设置到页面上的第一个空 input
或 textarea
字段。这适用于 input
,但不适用于 textarea
。
$(':input:text[value=""]').first().focus()
有人能帮我吗?
我正在尝试将焦点设置到页面上的第一个空 input
或 textarea
字段。这适用于 input
,但不适用于 textarea
。
$(':input:text[value=""]').first().focus()
有人能帮我吗?
您需要按正确的顺序查找页面上的所有input
和textarea
。 您可以使用它们的标签名称进行查询$('input, textarea')
,但为了保持正确的顺序,请在所有输入元素上使用类(例如.inputClass
)。 然后过滤非空元素,并将第一个元素.focus()
:
//** search for the input class and filter the elements found **/
var emptyAreas = $('.inputClass').filter(function(index, element) {
return $.trim($(element).val()) === ''; // element .val() is '' after trimming white spaces = true
});
emptyAreas.first().focus(); // get the 1st element and focus it
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul>
<li><input class="inputClass" value="text"></li>
<li><textarea class="inputClass"></textarea></li>
<li><input class="inputClass" value=" "></li>
<li><textarea class="inputClass">text</textarea></li>
<li><textarea class="inputClass"> </textarea></li>
</ul>
$("textarea:empty,input:text[value='']").first().focus();
文本区域在被调用时没有任何值,因为它们是通过
标签进行调用的。<textarea>Content</textarea>
我的建议是:
$(':text, textarea').on('blur', function(e) {
var emptyField = $(':text, textarea').filter(function(index, element) {
return element.value == '';
});
if (emptyField.length > 0) {
emptyField.first().focus();
}
});
<script src="https://code.jquery.com/jquery-1.12.1.min.js"></script>
<form>
First name:<br>
<input type="text" name="firstname"><br>
Last name:<br>
<input type="text" name="lastname">
Comment:<br>
<textarea name="comment" form="usrform"></textarea>
</form>
关于.inputClass,@Ori Drori提出了很好的观点。
我稍微改进了你的答案。排除隐藏字段并动态添加.inputClass。
// adding .inputClass to inputs to maintain the order in the filter below
$('input, textarea').addClass('inputClass');
const emptyAreas = $('.inputClass').filter(function (index, element) {
const hidden = $(element).is('hidden') || $(element).attr('type') === 'hidden'; // excluding hidden elements
return !hidden && $.trim($(element).val()) === ''; // element .val() is '' after trimming white spaces
});
emptyAreas.first().focus(); // get the 1st element and focus it