Question

我在表单上有一个文本框，其内容由jquery函数设置。我对多个文本框使用相同的功能。在某些情况下，它工作得很好虽然看起来在第一个它更新DOM所以当我检查它时我可以看到文本框的内容已经改变，虽然在屏幕上它显示为空白？

所以第一个实例看起来像：

or ds

，第二个看起来像：

<div class='form-group director1'>
   <label class='col-sm-2 control-label'>Company Address</label>
   <div class="col-sm-6"><textarea id="a1-companyaddress" class='form-control' name="a1-companyaddress" rows="5" cols="40" style="overflow-y: scroll;">&nbsp;</textarea></div>                              
</div>

触发更新的代码是按钮，如下所示：

<div class='form-group director2'>
  <label class='col-sm-2 control-label'>Company Address</label>
  <div class="col-sm-6"><textarea id='a2-companyaddress' class='form-control' name='a2-companyaddress' rows="5" cols="40" style="overflow-y: scroll;"></textarea></div>                             
</div>

对于a1前缀，所有输入都与文本框分开，对于a2前缀，它完全没问题。字段ID在页面上是唯一的。为什么会这样？

Answer 1

首先，从AJAX调用的设置中删除async: false。这是非常糟糕的做法。如果您检查控制台，您甚至会看到浏览器本身告诉您不要这样做。

关于您的问题，您应该使用val()来更新textarea的值，而不是html()：

$('#' + prefix + '-companyaddress').text(bits[2]);

我还强烈建议你研究使用DOM遍历技术。这样你可以省略HTML中不必要的增量id属性，并摆脱JS中丑陋的'#' + prefix + '-X'串联

Jquery .html刷新dom但有时不会在屏幕上显示？

1 个答案: