.append 在 Firefox 或 Safari 中不起作用答案

【问题标题】：.append not working in firefox or safari.append 在 Firefox 或 Safari 中不起作用
【发布时间】：2016-03-29 22:45:27
【问题描述】：

Jquery .append 在 firefox 或 safari 中不起作用，但 .val 可以。

有趣的是，相同的代码在 IE 中也能正常工作。

代码：

<head>
    <link rel="stylesheet" type="text/css" href="  https://cdnjs.cloudflare.com/ajax/libs/normalize/3.0.3/normalize.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/pure/0.6.0/pure-min.css">
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.4/jquery-ui.min.js"></script>
    <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

<script type = "text/javascript">
    $(document).ready(function () {           
         $("#notes").change(function () {
            $('#notes').val($('#notes').val() + "Test1");
            $('#notes').append('Test2');
        });            
    });
</script>

<textarea rows="10" name="Notes1" id="notes" style="width: 100%" ><?php
    if (isset($_SESSION['order'])) {
        echo $_SESSION['order'][0]['tNotes'];
    }
</textarea>

因此，上面的代码在将 Test1 和 Test2 添加到 Internet Explorer 中的 textarea 时工作正常，但只有 .val 在 FF/safari 中工作 Test1 而 .append 不工作。

这是为什么？获得等价物的任何帮助或替代方法（将文本附加到已编辑的位置，而不仅仅是底部）

【问题讨论】：

标签： javascript jquery html css safari

【解决方案1】：

编辑：

（将文本附加到已编辑的位置，而不仅仅是底部）

使用val() 使其适用于所有浏览器。

See this updated fiddle

$(document).ready(function () {
  $("#notes").change(function () {
    insertAtCaret($(this).prop('id'),"this");
    $(this).val($('#notes').val() + "here");
  });
});

注意 - 我使用了这个 SO 帖子中的一个函数： Inserting a text where cursor is using Javascript/jquery

【讨论】：

Noo，我的代码解释说一个适用于所有浏览器 (.val) 但一个只适用于 IE (.append)
你我的朋友真棒

【解决方案2】：

Textarea 是一种输入容器类型，因此您必须使用 .val() 方法来设置元素的值。 .append() 在 IE 中有效，因为 IE 不关心标准。

【讨论】：

好的，谢谢，有没有办法让 .val() 将文本添加到 textarea 的最后更改的行（如 .append）？
.val() 是一个 getter 和一个 setter。没有参数它得到，有参数它设置。