Question

我正在尝试将第一个输入字段的渲染值放到第二个输入字段中但我在输出方面遇到了一些问题

这是代码：

<script>
   function displayNumber(){     
      var card = document.getElementById('credit').value;

      var str = "";
      for(var i=1; i <= card.length-4; i++) {
         str += "*";
      }

      ecard = str + card.substr(card.length-4);
      document.getElementById('out').innerHTML = ecard;
      $("#output").val(ecard);
   }

   window.onload = displayNumber; 
</script>

<form id="myform">
   <input type="text" id="credit"   value="123456789012">
   <br>
   <input type="text" id="output" > 
</form> 

<label id="out"></label>

信用额度为123456789012

应该在输入字段“output”中显示为

********9012

这是演示 JSFIDDLE

Answer 1

如果要将值推送到输出，则应为：

document.getElementById('output').value = ecard;

我刚刚更新了你的小提琴，应该可以工作。

在输入标记中，不通过执行<input>value</input>来设置该值。相反，使用“value”属性设置该值，这就是innerHTML属性不起作用的原因，但value属性将会起作用。

在你的小提琴中，你使用No-Library（纯JS），这意味着你不能使用jQuery语法。

Answer 2

该代码应该可以使用，确保您使用的是jQuery库，我怀疑您使用的是javascript vanilla语法和jQuery文件。因此，请确保包含jQuery库以便工作。

如果您不打算使用jQuery，请替换以下行：

$("#output").val(ecard);

这个：

document.getElementById('output').value = ecard;

Answer 3

如果您打算使用jQuery，则必须等到它加载完毕。而不是像window.onload那样尝试$(document).ready()

$(document).ready(function() {

    displayNumber();

});

如果您打算在文档中仅使用displayNumber，那么执行此操作的简便方法就是这样

$(document).ready(displayNumber);

将渲染的输入值放在另一个输入字段中

3 个答案: