Question

在我的MVC5网络应用程序中，我有一个文本框，我将注释文本键入，然后单击按钮添加注释。 JavaScript ajax触发控制器操作方法，该方法将注释添加到数据库，返回带有添加注释的局部视图。然后它重建HTML。此时，只想删除键入文本框的内容。

这里是ajax调用，我尝试使用以下命令重置文本框： document.getElementById（＆＃34; comment_1＆＃34;）。innerText =＆＃34;再次添加评论...＆＃34 ;;

＆＃13;

            // For when clicking the addComment button. Adding a new comment.
            $('.addComment').on('click', function () {
                var postId = $(this).attr('data-id');
                var commentMsg = $('#comment_' + postId).val();
                var dateTimeNow = new Date();

                // An object.
                var comment = {
                    CommentMsg: commentMsg,
                    CommentedDate: dateTimeNow.toLocaleString()
                };

                // Call the Comments controllers action method to get add a comment related to the post id. Will show a partial view.
                $.ajax({
                    type: 'POST',
                    url: '@Url.Action("AddComment", "Comments")',
                    data: { comment, postId },
                    success: function (response) {
                        $('div[class=allComments_' + postId + ']').remove();

                        // Dynamically building the HTML to hold the comments returned which now includes the added comment.
                        // The area for the Shared/_MyComments.cshtml to be placed.
                        var allCommentsArea = $('<div>').addClass('allComments_' + postId);

                        allCommentsArea.html(response);
                        allCommentsArea.prependTo('#commentsBlock_' + postId);

                        // Reset the value in the input textbox.
                        document.getElementById("comment_1").innerText = "Add a Comment Again ...";
                    },
                    error: function (xhr, ajaxOptions, thrownError) {
                        alert("Critical Error: something is wrong in the call to AddComment! Status: " + xhr.status + ". Error: " + thrownError.toString() + ". Response Text: " + xhr.responseText);
                    }
                });
            });

＆＃13;

这里是文本框 - 其ID将变为＆＃34; comment_1＆＃34;：

＆＃13;

            <div id="@string.Format("{0}_{1}","commentsBlock", post.PostID)" style="border: 1px solid #f1eaea; background-color: #eaf2ff;">
                <div class="AddCommentArea" style="margin-left: 30%;  margin-bottom: 5px; margin-top: 8px;">
                    <input type="text" id="@string.Format("{0}_{1}", "comment", post.PostID)" class="form-control" placeholder="Add a Comment ..." style="display: inline;" />
                    <button type="button" class="btn btn-default addComment" data-id="@post.PostID"><span class="glyphicon glyphicon-comment" aria-hidden="true"></span></button>
                </div>
            </div>

＆＃13;

在我尝试将文本框重置为其他值后，我在键入的页面中显示了结果页面。

我没有删除我输入的文字。我试过.innerText，.innerHTML和.TextContent

建议的测试结果：

Answer 1

您正在做的是将输入的文本设置为＆＃34;再次添加评论..＆＃34;当你真的想要清除输入文本+制作占位符时＃34;再次添加评论..＆＃34;。尝试更改此代码

// Reset the value in the input textbox.
document.getElementById("comment_1").innerText = "Add a Comment Again ...";

到此：

// Reset the value in the input textbox using jquery.
$("#comment_1").val('')
document.getElementById("comment_1").placeholder = "Add a Comment Again ...";

这样，您既可以清除旧文本，也可以使占位符成为您想要的内容。

从HTML文本框中删除文本

1 个答案: