Question

所以我想做的是用相同的输入值填充文本输入。这是一个示例表单。

    <button class="btn">Fill All</button>
    <input type ="text" class="inpt" ></input>
    <input type ="text" class="inpt" ></input>
    <input type ="text" class="inpt" ></input>
    <input type ="text" class="inpt" ></input>

我看到了一个javascript示例，它取了一个输入的名称并以这种方式填充它，并看到了一个Jquery示例，这是由id在这里做什么的：copy text box content to another textbox while typing但是如果没有指定id，我怎么能这样做所有类和名称都具有相同的值。我是Jquery的新手，js太笨了，无法弄明白，也找不到任何例子。

编辑：感谢您提供了很好的答案，但有没有办法从第一个或任何文本框中获取值，并使用该值填充其他值。

Answer 1

在输入字段上使用onkeyup事件并将值复制给其他人还有一件事，input是单身HTML标记，因此您不会关闭就像</input>而不是<input {some parameters here}/>。

$(function(){
  $('.inpt').on('keyup', function(){
    var val = $(this).val();
    $('.inpt').val(val);
  })
})

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type ="text" class="inpt" />
    <input type ="text" class="inpt" />
    <input type ="text" class="inpt" />
    <input type ="text" class="inpt" />

Answer 2

只是一个例子，它是如何做到的：

在keyup amy输入上绑定，然后保存它的值并用其值替换所有其他输入，然后再次聚焦相同的输入，以便用户可以继续输入。

$(function(){
  $('input[type="text"]').on('keyup', function(){
      value = $(this).val();
      $('input[type="text"]').val( value );
      $(this).focus();
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button class="btn">Fill All</button>
    <input type ="text" class="inpt" />
    <input type ="text" class="inpt" />
    <input type ="text" class="inpt" />
    <input type ="text" class="inpt" />

Answer 3

这就是你需要的吗？

$(function(){
   $('.btn').on('click', function(){
     var $value = $('input').val();
     $(".inpt").val($value);
   });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
<button class="btn">Fill All</button>
<input type ="text" class="inpt" />
<input type ="text" class="inpt" />
<input type ="text" class="inpt" />
<input type ="text" class="inpt" />

Answer 4

如果您有课程，可以尝试：

 $('input').keyup(function() {
    var txtClone = $(this).val();
    $('input[class$=inpt]').val(txtClone);
});

Answer 5

这是一个简单的代码，可以解决你的问题，祝你好运！

<强> HTML：

<input type="button" class="btn" onclick="fillAll()" value="Fill All"></input>
<input type ="text" class="inpt" />
<input type ="text" class="inpt" />
<input type ="text" class="inpt" />
<input type ="text" class="inpt" />

<强>使用Javascript：

  function fillAll(){

        var inputArray = document.getElementsByTagName("input");

      for(var i = 0; i < inputArray.length; i++){
        if(inputArray[i].getAttribute("type") != "button"){
            inputArray[i].value = "hello!";
        }
      }

    }

如何在不需要ID的情况下使用相同的值填充所有文本输入？

5 个答案: