Question

首先：我对jQuery比较陌生，所以请保持温和;）

我想要实现的目标：我有一个Java服务器（后端），它可以进行一些文本解析并提供REST样式的API。另一方面（前端）我有一个带有表单和几行jQuery代码的HTML文件。

<html>
<body> 
  <form id="form">
    <table>
      <thead>
      <tr>
        <th>Code</th>
        <th>&nbsp;</th>
        <th>Code</th>
      </tr>
    </thead>
    <tbody>
      <tr>
        <td><textarea id="input" name="input" cols="100" rows="50" type="text" placeholder="Input your code here..."></textarea></td>
        <td>
            <button id="btnTranslate" type="submit">Translate -&gt;</button>
        </td>
        <td><textarea id="output" name="output" cols="100" rows="50" type="text" placeholder=" "></textarea></td>
      </tr>
      </tbody>
    </table>
  </form>

<script src="http://code.jquery.com/jquery-1.10.2.min.js"></script>
<script type="text/javascript">
  $('#btnTranslate').click(function () {
      var valueOfTextArea = $('textarea#input').val();
      $.post("/parse", $('textarea#input').val(),
              function (data) {
                  alert("Data Loaded: " + data);
                  $('#output').val("" + data);
                  $('#input').val(valueOfTextArea);
              }
      );
  });
</script>
</body>
</html>

问题是：数据被发送，在服务器端被转换并被发送回客户端，导致警报窗口弹出，至少有一些时间。但是，textAreas永远不会正确更新。

我经常搜索Google并尝试了几乎所有关于此网站的建议。到目前为止没有运气。

我错过了什么？我做错了什么？

Answer 1

正如我在与我的一位同事的调试会议中所了解的那样，一个可能的解决方案是：

    $('#btnTranslate').click(function (event) {
        var valueOfTextArea = $('textarea#input').val();
        event.preventDefault();
        $.post("/parse", valueOfTextArea, function (data) {
            $('#output').val(data);
            $('#input').val(valueOfTextArea);
        });
    });

因此，您需要阻止默认的单击操作，因为它会以某种方式在XMLHttpRequest上导致“状态0”。我仍然没有全面了解，但至少它现在有效。

感谢大家的投入。

Answer 2

你说“textareas永远不会更新正确”是什么意思？
您确定在控制台中没有收到任何错误吗？
确保您在服务器上运行脚本，因为您的浏览器可能会阻止请求

尝试添加后备方法。从这样的事情开始：

valueToSend = $( "#input" ).val();
var request = $.post( "/parse", valueToSend, function() {
  alert( "success" );
})
  .done(function() {
    alert( "second success" );
  })
  .fail(function() {
    alert( "error" );
  })
  .always(function() {
    alert( "finished" );
});

jQuery不会更新textArea

2 个答案: