删除输入后，jQuery无法将文本附加到html
删除输入后，jQuery无法将文本附加到html
提问于 2017-05-30 12:24:21
我有一个表格，你可以在那里附加表情符号，通过标记或点击一个表情选择器。在选择器中单击一个表情符号时，它运行以下jQuery代码：
$('.emoji-container').click(function () {
var target = $(this).closest('.emoji-container');
var emojiName = target.data('clipboard');
var activityLength = $('.input-field').val().length;
var emojiLength = (emojiName).length;
var totalLength = activityLength + emojiLength;
if (totalLength < 90) {
$('.clipboard-emoji').html("Added: '" + emojiName + "'");
$('.input-field').append(emojiName + " ");
console.log(activityLength, '+', emojiLength, '=', totalLength)
} else {
$('.clipboard-emoji').html("Max. characters reached, can't copy");
console.log('full')
}
});所以每个人都在完美地工作，但是当我删除输入字段中的字符时，再次添加另一个表情符号就足够了，它不会将其附加到输入字段中。我的表情符号被添加成这样的标记：:smiley:
我的控制台：
0 "+" 19 "=" 19 // at this point I add the first emoji
20 "+" 19 "=" 39
40 "+" 19 "=" 59
60 "+" 19 "=" 79
full // at this point the max is reached and I clear the input again
0 "+" 19 "=" 19 // at this point I cleared the whole input field
0 "+" 10 "=" 10 // as you can see the input length stays 0
0 "+" 11 "=" 11
0 "+" 7 "=" 7
0 "+" 8 "=" 8我不明白为什么在删除字符或输入字段中的全部输入时，它不会再次添加它们
回答 1
Stack Overflow用户
回答已采纳
发布于 2017-05-30 13:11:38
更改以下行
$('.input-field').append(emojiName + " ");至
$('.input-field').val($('.input-field').val() + emojiName + ' ');显然，append不适合这个操作，但是val()是。我不知道为什么，但是，嘿，很管用！
编辑：如果您想提高性能，请将选择器存储在一个变量中：
var $inputField = $('.input-field')
编辑2:
$(textarea).append(txt)的工作方式不像您针对问题思考的海报所做的那样。加载页面时，textarea中的文本节点将设置该表单字段的值。之后，可以断开文本节点和值的连接。在输入字段时，值会发生变化，但DOM中的文本节点不会发生变化。然后用append()更改文本节点，浏览器删除值，因为它知道标记中的文本节点已经更改。 所以你想要设置值，你不想附加。为此使用jQuery的val()方法。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/44262193
复制相关文章
相似问题
腾讯云开发者
