Question

我正在尝试向jQuery .validate中添加一个方法，以检查Summernote（所见即所得编辑器）textarea是否为空，并且我无法触发该方法（放置在其中的警报不会显示）。控制台中没有错误。

方法是：

//Add validation method to check for an empty Award Description
$.validator.addMethod("htmlEditorEmpty", function(value, element) {
    alert("checking");
    return this.optional(element) || value.summernote('isEmpty');
}, "Please enter details");

这由（此工作前后的其他验证）调用：

awardDescription: {
    htmlEditorEmpty: true,
    maxlength: 1500,
},

检查HTML：

<div class="col-lg-3 col-md-3 col-sm-3 col-xs-3">
    <div class="form-group">
        <div>
            <textarea class="summernote" id="awardDescription" name="awardDescription" rows="3"></textarea>
        </div>
    </div>
</div>

我已将其放置在submitHandler中：

if ($('#awardDescription').summernote('isEmpty')) {//using id
    alert('contents is empty1');
}

if ($('awardDescription').summernote('isEmpty')) {//using name
    alert('contents is empty2');
}

第一个起作用（即，仅在为空时显示），而第二个总是显示（即，即使输入值）。我之所以提供此信息，是因为我相信.validate使用名称而不是ID。我可能是错的。

Answer 1

Summernote为此进行了内置测试。这是我正在使用的代码：

if ($('#summernote').summernote('isEmpty'))
{
  alert('editor content is empty');
}

您正在使用什么以及触发警报的原因。您的其他测试未使用您使用的语法测试有效的ID或名称。我认为浏览器会抛出错误或忽略您的第二次测试

要使用名称进行测试，请使用val（） $（'form [name =“ ???”] input [name =“ ???”]'）。val（），

Answer 2

此解决方案在summernote为空或具有空白时禁用提交按钮。

HTML

<form>
    <textarea class="summernote" name="summernote" id="summernote" cols="100" rows="10"></textarea>
    <button id="btnForm" type="submit" disabled>Publish</button>
</form>

JS

$(document).ready(function () {
    $('[id="summernote"]').summernote({
    }).on('summernote.keyup', function() {

        var text = $("#summernote").summernote("code").replace(/&nbsp;|<\/?[^>]+(>|$)/g, "").trim();

        if (text.length == 0) {
            $("#btnEditarNoticia").attr("disabled", "disabled");
        } else {
            $("#btnEditarNoticia").removeAttr("disabled");
        }
    });
});

向jQuery添加方法.validate以检查summernote文本区域是否为空

2 个答案: