使用jquery

Question

这是小提琴 https://jsfiddle.net/or0db22d/

如果文本框内容的长度大于3，我想显示div错误，然后将错误显示为div格式

当文本框没有进入或没有焦点时，div错误应该出去

HTML

<div id="errorholder">
</div>
<br />
<input id="txtbox" type="text">

JS

$('#txtbox').onchange(function(e) 
{
if($(this).length >3)
$('#errorholder').text("wrong format");

});

$('#txtbox').focusout(function(e) 
{
$('#errorholder').text("");

});

如何写这两个函数？

Answer 1

$('#txtbox').on('input', function(e) {
  if ($(this).val().length > 3)
    $('#errorholder').text("wrong format");
  else
    $('#errorholder').text("");
});

//$('#txtbox').focusout(function(e) {
//  $('#errorholder').text("");

//});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="errorholder">
</div>
<br />
<input id="txtbox" type="text">

1. 使用on input活动
2. 使用.val()
获取输入值

Answer 2

将我们的JS代码更改为

$('input').on('keyup',function(){
      if($(this).val().length > 3)
      $('#errorholder').text("wrong format");
});

Answer 3

试试这个。你必须使用keyup事件。更改事件将只听您关注文本框。要查找文本框的长度，您必须使用$（this）.val（）。length

$('#txtbox').keyup(function(e) 
{
  if($(this).val().length >3){
    $('#errorholder').text("wrong format");
  }
});

$('#txtbox').focusout(function(e) 
{
$('#errorholder').text("");

});

此处更新了jsfiddle，https://jsfiddle.net/or0db22d/4/