Question

今天我上学做作业。我可以将表情符号传递给文本框但如果单击它将替换文本框中的先前表情符号或文本。我想知道如果单击并且能够保留输入表情符号或文本，如何不替换文本框文本。对不起，如果你们不明白我的英语不好。

$(document).ready(function () {
    $("ul").hide();
    $("input.btnemoji").click(function () {
        $("ul").toggle();
        $("ul.emoji li").click(function () {
            $("#ToSend").val($(this).text());
        });
    });
});

<asp:Textbox id="ToSend" runat="server" Width="300px"></asp:Textbox>
<input type="button" class="btnemoji" value="&#x1F600;" />
<ul class="emoji">
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>

Answer 1

要添加到现有值，您需要附加到val()中的input，而不是每次都替换它。为此，您可以将函数传递给val()方法，该方法为您处理附加内容，如下所示：

$(document).ready(function() {
  $("ul").hide();

  $("input.btnemoji").click(function() {
    $("ul").toggle();
  });

  $("ul.emoji li").click(function() {
    var $li = $(this);
    $("#ToSend").val(function(i, v) {
      return v + $li.text();
    });
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="text" id="ToSend" width="300px">
<input type="button" class="btnemoji" value="&#x1F600;" />
<ul class="emoji">
  <li></li>
  <li></li>
  <li></li>
  <li></li>
  <li></li>
</ul>

另请注意，我将$("ul.emoji li").click()处理程序移到.btnemoji的之外，因为每次切换ul时都会重复添加新的事件处理程序

Answer 2

这是最短的方法。您只需要使用它：

$("#ToSend").val($("#ToSend").val()+$(this).text());

＆＃13;

$(document).ready(function () {
    $("ul").hide();
    $("input.btnemoji").click(function () {
        $("ul").toggle();
    });
    $("ul.emoji li").click(function () {
        $("#ToSend").val($("#ToSend").val()+$(this).text());
    });
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="ToSend"/>
<input type="button" class="btnemoji" value="&#x1F600;" />
<ul class="emoji">
    <li></li>
    <li></li>
    <li></li>
    <li></li>
    <li></li>
</ul>

＆＃13;

Answer 3

$("#ToSend").append($(this).text());

用户追加功能而不使用

如何传递<li>文本而不替换文本框上的文本

3 个答案: