Question

我有一个＆＃34;帖子＆＃34;在文本区域输入文本时激活的按钮（从模糊变为彩色，从禁用变为启用）。

这样可以正常工作，但我希望文本区域能够在文本区域中没有任何内容时进行检测。所以，让我们说我输入了＃34; abc＆＃34;进入文本区域..提交按钮将变为活动状态，但我要说我现在删除所有文本..按钮仍处于活动状态..不完全，因为我有这个：

commentButton.prop({ disabled: commentBox.val() == 0 });

这会阻止表单在textarea中提交任何内容。问题是提交按钮仍然是彩色的，并且不会像预期的那样返回到模糊的非活动状态。

所以这让我想到了我的问题..

我可以设置一些能够在我专注于文本区域时激活并开始收听的内容并输入并知道我何时从文本区域删除了所有内容？

这样我可以设置一个if语句来说明文本是否全部删除然后removeClass为彩色状态按钮，addClass为模糊状态按钮。

此外，这也适用于白色空间。

这是我目前的代码：

.comment_box =我的文字区域

.activeCommentButton =彩色提交按钮

.commentButton =模糊提交按钮

$(".microposts").off().on("focus", ".comment_box", function () {
    $(this).prop("rows", 7);
    $(this).parent().find(".activeCommentButton").removeClass("activeCommentButton").addClass("commentButton");
    var commentBox = $(this),
        form = $(this).parent(),
        cancelButton = form.children(".commentButtons").children(".cancelButton"),
        commentButton = form.children(".commentButtons").children(".commentButton");
    $(this).removeClass("comment_box").addClass("comment_box_focused").autoResize();
    form.children(".commentButtons").addClass("displayButtons");
    commentButton.prop({
        disabled: true
    });
    commentBox.off().on("keyup keypress input change", function () {
        commentButton.prop({
            disabled: commentBox.val() == 0
        });
        commentButton.removeClass("commentButton").addClass("activeCommentButton");
    });
    cancelButton.click(function () {
        commentBox.removeClass("comment_box_focused").addClass("comment_box");
        form.children(".commentButtons").removeClass("displayButtons");
        commentBox.val("");
    });
});

亲切的问候

Answer 1

是试试这个，你可以修改它：

$(".commentButton").prop({ disabled: true });

$(".comment_box").keypress(function() {

    $(".commentButton").prop({ disabled: !$(this).val().length >= 1 })           

});

Answer 2

这对我有用，但有更清洁的方法吗？

 commentButton.prop({ disabled: true });

                commentBox.off().on("keyup keypress input change", function () {
                  commentButton.prop({ disabled: commentBox.val().length == 0 });
                  if ( commentBox.val().length > 1 ) {
                  commentButton.removeClass("commentButton").addClass("activeCommentButton");
              } else {
                commentButton.removeClass("activeCommentButton").addClass("commentButton");
              }
                });

是否可以在JQuery中对键入textarea的文本进行实时检测？

2 个答案: