如何在文本区域中设置最小字符

时间:2018-07-12 18:05:15

标签: javascript jquery textarea

我试图在Textarea中设置最少字符以供评论。我希望用户在提交表单之前输入最少的字符。我已经有一个代码来检查最大字符数。

如何修改此代码以使注释文本区域的字符数最少?

我在其中添加了新代码。

var maxComments = 500;
    function limComments(obj) {
        while(obj.value.length > maxComments) {
            obj.value = obj.value.replace(/.$/,'');
        }
    }

非常感谢!

1 个答案:

答案 0 :(得分:0)

这将依赖于内置属性,而JS用于“备份”。如果出于某种原因您想要放弃内置的,可以将它们替换为data-mincount="10"data-maxcount="500"

如果您使用的是兼容HTML5的浏览器,并且支持maxlength="500"minlength="10"属性,它将阻止输入超过500个字符。虽然它不会直接影响该字段的最小值,但会阻止表单的提交。然后,浏览器本身将显示错误的条目。

编辑:注意输入的修剪,更新后的代码可以反映出来。

function limComments(obj) {
  var charLimit = [obj.getAttribute('minlength'), obj.getAttribute('maxlength')];
  var fieldID = obj.getAttribute('id');

  if (obj.value.length >= charLimit[0] && obj.value.length <= charLimit[1]) {
    console.log("The comment in " + fieldID + " is just right.");
  } else if (obj.value.length > charLimit[1]) {
    console.log("The comment in " + fieldID + " is too long.");
    obj.value = obj.value.substring(0, charLimit[1]); // Truncate to first 500 characters
  } else {
    console.log("The comment in " + fieldID + " is too short.");
  }
}
<label for="comment1">Comment 1</label>
<textarea rows="3" cols="85" maxlength="500" minlength="10" name="Q1C" onblur="limComments(this)" title="Comments" id="comment1" class="textarea" /></textarea>
<br>
<label for="comment2">Comment 2</label>
<textarea rows="3" cols="85" maxlength="500" minlength="10" name="Q2C" onblur="limComments(this)" title="Comments" id="comment2" class="textarea" /></textarea>
<br>
<label for="comment3">Comment 3</label>
<textarea rows="3" cols="85" maxlength="500" minlength="10" name="Q2C" onblur="limComments(this)" title="Comments" id="comment3" class="textarea" /></textarea>