jQuery Textarea-validation 不起作用

Posted 2023-05-07

【中文标题】jQuery Textarea-validation 不起作用

【英文标题】：jQuery Textarea-validation doesn't work

【发布时间】：2017-10-28 19:25:52

【问题描述】：

我想用 textarea 验证表单。到目前为止，一切都很好。但是当我尝试使用 jQuery validate 插件初始化 textarea 时，什么也没有发生。工具提示不显示。我正在使用 tooltipster 和 jQuery-validate 插件。

在控制台中没有显示 javascript 错误。

这是表格：

<form name="reportForm" id="reportForm" method="POST">
<div class="form_alt_design">
    <label for="the_report"></label>
    <textarea name="report" cols="60" rows="4" maxlength="2000" id="the_report" class="report_textbox"></textarea>
</div>
<div id="report_button_container" style="text-align:right;">
    <input class="button_large2" type="submit" name="Submit" id="report_submit" value="<?php echo GAME_SUBMIT_REPORT;?>" onclick="submitReport(<?php echo $id.",'".$type;?>')" />
    <input class="button_large2" type="submit" name="Submit" id="report_submit" value="<?php echo GAME_SUBMIT_REPORT;?>" onclick="" />

    <input type="hidden" name="token" id="token" value="<?php echo $reportToken; ?>" />
</div>

JavaScript 代码：

$(document).ready(function() 
$('#reportForm textarea').tooltipster(
    trigger: 'custom',
    animation: 'fade',
    animationDuration: 250,
    delay: 0,
    onlyOne: true,
    position: 'right',
    theme: ['tooltipster-noir', 'tooltipster-noir-customized']
);

// initialize validate plugin on the form
$('#reportForm').validate(

    errorPlacement: function (error, element) 

        var ele = $(element),
        err = $(error),
        msg = err.text();
        if (msg != null && msg !== '') 
                ele.tooltipster('content', msg);
                ele.tooltipster('open');
    
    

    ,
    success: function (label, element) 
        $(element).tooltipster('hide');        ,
    unhighlight: function(element, errorClass, validClass) 
        $(element).removeClass(errorClass).addClass(validClass).tooltipster('close');
    ,
    rules: 
        the_report: 
          required:true
        
    ,
    submitHandler: function (form) 


);

【参考方案1】：

您已将required 规则分配给the_report，但您的textarea 包含name="report"。

您只能在rules 对象中使用name。

rules: 
    report:  //  <- MUST match the NAME, not the ID
        required: true
    
,

您从未说明 ToolTipster 的版本，但here is a working jsFiddle demo using v4.0

REFERENCE: Proper jQuery Validate integration for ToolTipster versions 2, 3, and 4.

【讨论】：

它有效！:) 当我删除我在文本区域内输入的文本时出现了该消息。谢谢你的帮助，伙计！