<!doctype html> <html> <head> <meta charset="utf-8"> <title>jQuery控制input的字数</title> <script src="http://libs.baidu.com/jquery/2.1.4/jquery.min.js"></script> <style> </style> </head> <body> <input class="form-control" id="title" name="title" placeholder=" 请输入" type="text"> <a href="" id="titleCount" style="color:#9B9B9B;text-decoration: none;font-size:12px;">还可以输入12个字</a> <script> $("#titleCount").text("还可以输入" + (12 - $("#title").val().length) + "个字"); $("#title").keyup(function() { if ($("#title").val().length > 12) { $("#title").val($("#title").val().substring(0, 12)); } $("#titleCount").text("还可以输入" + (12 - $("#title").val().length) + "个字"); }); </script> </body> </html>
