在 TextAreaFor 中输入表情符号答案

【问题标题】：Inputting emoticons in TextAreaFor在 TextAreaFor 中输入表情符号
【发布时间】：2017-12-14 17:40:47
【问题描述】：

我正在尝试在我的论坛中实现一些表情符号，但我的 JS 代码似乎无法正常工作。 JS：

$button = $('button[name="smiley"]')
$('button').on('click', function () {
$('textareafor[name="content"').append(":)")})

HTML：

@using Reddit.Models
@model CreateTopicViewModel

<div class="row">
    <div class="col-md-6 col-md-offset-3">
        <section id="postForm">

            @using (Html.BeginForm("CreateTopic", "Home", FormMethod.Post, new { @class = "form-horizontal", role = "form" }))
            {
                <div class="form-group">
                    @Html.LabelFor(x => x.Name, new { @class = "control-label" })
                    @Html.TextBoxFor(x => x.Name, new { @class = "form-control" })
                </div>             
                <button name="smiley">s</button>
                <div class="form-group" name="content">
                    @Html.LabelFor(x => x.Content, new { @class = "control-label" })
                    @Html.TextAreaFor(x => x.Content, new { @class = "form-control", @rows = "8" , name = "content" })
                </div>
                <button type="submit" class="btn btn-block btn-primary">Post Topic</button>
            }
        </section>
    </div>
</div>

这里有什么交易？我在错误的轨道上吗？谢谢。

【问题讨论】：

标签： javascript html asp.net razor

【解决方案1】：

您仍然在正确的轨道上，但这里更倾向于使用id 属性，因为name 属性决定了用户在 POST 请求中的输入名称。

首先，将id 属性放在smiley 按钮和文本区域：

<button id="smiley">s</button>

@Html.TextAreaFor(x => x.Content, new { @class = "form-control", @rows = "8", id = "content" })

然后你可以使用这个脚本将表情符号添加到 textarea 中：

<script>
    $('#smiley').click(function () {
        var textarea = $('#content');
        textarea.val(textarea.val() + ":)");
    });
</script>

实时实施：.NET Fiddle example。

参考：

How to append text to '<textarea>'?

【讨论】：