Javascript jQuery更新DOM,浏览器不更新

Javascript jQuery更新DOM,浏览器不更新,javascript,php,jquery,Javascript,Php,Jquery,我正在从事一个项目,例如,当用户在字段1中输入数据时,应使用数据库中的值更新网页上的字段3。这已经可以正常工作了,没有任何问题 但是如果用户先修改字段号3,然后再修改字段号1,只会更新DOM(正如我从Firebug中可以看出的那样),但是对用户来说,字段号3没有任何可见的更改 我创建了这个问题的一个非常基本的版本,但我仍然无法判断这里出了什么问题 HTML PHP 必须通过.val()方法而不是html()设置textarea的值 如果您只使用一个应在更改时调用request的textarea

我正在从事一个项目,例如,当用户在字段1中输入数据时,应使用数据库中的值更新网页上的字段3。这已经可以正常工作了,没有任何问题

但是如果用户先修改字段号3,然后再修改字段号1,只会更新DOM(正如我从Firebug中可以看出的那样),但是对用户来说,字段号3没有任何可见的更改

我创建了这个问题的一个非常基本的版本,但我仍然无法判断这里出了什么问题

HTML

PHP


必须通过.val()方法而不是html()设置textarea的值


如果您只使用一个应在更改时调用request的textarea id,可能会更具描述性。

为什么您会有两个具有相同id的文本区域?谢谢。只是一个输入错误,不会影响问题。这是解决方案,尽管对textarea的值和html之间的差异进行更多的解释可能会更好。.html()方法用于标记,如,,,.val()方法用于输入标记,如,它也适用于textareas,只是元素的HTML内容是默认值,而不是当前值。这就是为什么HTML()对于Inputs实际上是无用的。Inputs是不同的,它们是空元素,并且根本没有子节点。
<div id="container1">
  <textarea id="container1.1">Entry 1.1</textarea>
  <textarea id="container1.2">Entry 1.2</textarea>
  <textarea id="container1.3">Entry 1.3</textarea>
</div>
$(document).ready(function() {
  $('textarea').change(function() {
    var clickedObject = $(this);
    var id            = $(this).attr('id').substr(9);
    var value         = $(this).val();
    var dataString    = "id=" + id + "&value=" + value;

    $.ajax({
      type: "POST",
      url: "update.php",
      data: dataString,
      cache: false,
      success: function(Result)
      {
        if(Result == '-')
        {
          console.log('Nothing to do');
        } else {
          clickedObject.next().next().html(Result);
        }
      }
    });
  });
});
<?php
  if ($_POST['id'] == '1.1') {
    echo 'Modified string';
  } else {
    echo '-';
  }
?>