javascript - 以编程方式设置数字输入值不起作用

Question

我有一段设置数字输入值的javascript。但是，它不会起作用。调用后输入的值字段仍然为空(尽管输出元素的 val() 的 console.log() 确实显示了正确的值)。我已经尝试通过 jQuery 的 .val(total)、.attr('value', total) 和普通的旧 .value = 三种方式设置值，但仍然没有。我什至用 html 替换了整个元素，并将值连接到 value 属性中，但它不起作用。

知道为什么这行不通吗？

这是标记:

<div id="proposal_price_box">
  <div class="proposal_price_header sys_bkgcolor">
    <span class="title"><h3>Price to Appear on Proposal</h3></span>
  </div>
  <div class="inner">
    <span class="label">$</span>
    <input type="number" class="amount-input" id="proposal_price" value=""/>
  </div>
</div>

以及相关的 javascript:

$('#proposal_price').val('1234');

Jsfiddle 演示了下面的问题。

http://jsfiddle.net/n8z9K/12/

不知何故，如果显示元素的容器，它将设置值。但一旦它再次隐藏，它就会破裂。

编辑 抱歉，我没有在 JSfiddle 中正确演示问题。我正在尝试克隆容器的内容并将其放在其他地方。我更新了 jsfiddle 以更好地显示问题。

Answer 1

输入节点的值与其值属性之间存在差异。当您使用 val() 方法为其赋值时，您设置的是它的值，而不是它的 value 属性。当您使用 html() 方法时，您将获得具有所有属性(包括 value 属性)的 html，但该属性并没有通过您的 val() 分配更改。只有节点的值发生了变化。