首页 > 解决方案 > 遍历 HTML 输入并设置值

问题描述

我正在尝试遍历一些输入元素并在为空时替换它们的值。

$(document).ready(function() {
    var input = $('.test').val();
    var isValid;
    $("input").each(function (){
    	var element = $(this);
      if (element.val() == "") {
        $('.test').val('empty');
      } 
    });   
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<input class="test" type="text">
<input class="test" type="text">
<input class="test" type="text">
<input class="test" type="text">
<input class="test" type="text" value="test">

我想将值是否为空更改为“空”,但如果不是,则保留其自己的值。然而,尽管最后一个输入具有自己的值,但它将每个输入设置为“空”。有人能帮我吗?

标签: javascriptjqueryhtml

解决方案


利用

element.val('empty');

代替

$('.test').val('empty');

因为是为所有使用 class 的元素$('.test').val('empty');设置值。当您要更改特定元素的值时,请使用该引用而不是.emptytestelement$('.test')

这是您稍作修改的代码。

$(document).ready(function() {
    var input = $('.test').val();
    var isValid;
    $("input").each(function (){
    	var element = $(this);
      if (element.val() == "") {
        element.val('empty');
      } 
    });   
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<input class="test" type="text">
<input class="test" type="text">
<input class="test" type="text">
<input class="test" type="text">
<input class="test" type="text" value="test">


推荐阅读