Question

在向元素添加文本时，jQuery的append（）函数会在文本周围添加引号。我想改变它，而是用逗号或我想出的任何东西来分隔值。是否有替代append（）可以做到这一点？

为了给它一些上下文，我使用jQuery动态写入隐藏的<input>元素。

目前在添加一些内容（使用追加）后，生成的HTML如下所示：

<input type="hidden">"first"
    "second"
    "third"
</input>

在理想的世界中，HTML 应看起来像这样：

<input type="hidden">first, second, third</input>

使用jQuery来读取，连接，然后替换原始的<input>文本可能会起作用，但是我没有看到一个可以批量替换innerHTML的函数（我觉得它被称之为）。

想法？

Answer 1

在jquery中：

<div id="test"></div>

$('#test').append('a');
$('#test').append('b');

will look like this (in chrome dev tool):
<div id="test">
"a"
"b"
</div>

，而

<div id="test"></div>

$('#test').html($('#test').html() + 'a');
$('#test').html($('#test').html() + 'b');

will look like this:

<div id="test">ab</div>

两种情况下的dom树是相同的，只有它在带有引号的chrome dev工具中显示（它们实际上并不存在，右键单击 - ＆gt;编辑为html，它们将消失）

Answer 2

这里的一个大问题是input属性中设置value值，而不是内部子项：

<input type="hidden" id="myInput" name="myInput" value="first">

要执行您想要的操作，您可能希望使用.val()更改输入值：

$('#myInput').val($('#myInput').val() + ', second');

Answer 3

或者，您可以将文字附加到隐藏的范围：

<style> #hidden { display:none; } </style>

<span id="hidden"></span>

<script>
var x; // Where 'x' is the data that you would like to append.
$('#hidden').append(x);
</script>

Answer 4

(function($) {
    $.fn.iappend = function(str) {
        return this.each(function(){
            var $this = $(this);
            if($this.val().length > 0) {
                $this.val($this.val() + "," + str);
            } else {
                $this.val($this.val() + str);
            }
        });
    };
})(jQuery);

我尚未对它进行全面测试..但应该工作..

$("#hidden").iappend("first").iappend("second").iappend("third");

输出

您好，世界！

替代jQuery append（）

4 个答案: