bootstrap-maxlength长度验证

插件使用bootstrap-maxlength 1.9.1。

github地址：http://mimo84.github.io/bootstrap-maxlength/

**默认使用**

默认当输入框获得焦点时，提示将显示：

![](/uploads/images/20230107/94e53dd38bbc5f5b50f11028c4a10e03.png)

```html
<input type="text" class="form-control" maxlength="25" name="defaultconfig" id="defaultconfig">
```
```javascript
$("input#defaultconfig").maxlength({
    warningClass: "badge badge-info",
    limitReachedClass: "badge badge-warning"
});
```

**阈值**

使用 `threshold` 选项表示还有多少字符可以开始显示指示。

![](/uploads/images/20230107/589859908a4c4b3cc13894bab16816ef.gif)

```html
<input type="text" maxlength="25" name="thresholdconfig" class="form-control" id="thresholdconfig">
```
```javascript
$("input#thresholdconfig").maxlength({
    threshold: 20,
    alwaysShow: false,
    warningClass: "badge badge-info",
    limitReachedClass: "badge badge-warning"
});
```

**位置**

您所需要做的就是用其中一个字符串指定 `placement` 选项。如果未指定，则将被定位到“底部”。
![](/uploads/images/20230107/5cb3f00b1a3ed3ecc34ed95972bd5947.png)
```html
<input type="text" class="form-control" maxlength="25" name="placement" id="placement">
```
```javascript
$("input#placement").maxlength({
    // 可使用的值有: bottom, left, top, right, bottom-right, top-right, top-left, bottom-left 和 centered-right。
    // 你也可以使用 : bottom-right-inside, top-right-inside, top-left-inside and bottom-left-inside.
    alwaysShow: true,
    placement: "top-right-inside",
    warningClass: "badge badge-info",
    limitReachedClass: "badge badge-warning"
})
```

**始终显示**

如果 `showOnReady` 为 `true`，则在指示器就绪时始终显示。默认值：`false`。
![](/uploads/images/20230107/ff41d0333847ed7dcb36e85d276eb1ae.png)
```html
<input type="text" class="form-control" maxlength="25" name="alloptions" id="alloptions">
```
```javascript
$("input#alloptions").maxlength({
    showOnReady: true,
    warningClass: "badge badge-success",
    limitReachedClass: "badge badge-danger",
    separator: " 个字符； ",
    preText: "已输入 ",
    postText: " 个可用字符。",
    validate: !0
});
```

**文本域**

Bootstrap maxlength 支持文本区域和输入。即使在旧的IE上。
![](/uploads/images/20230107/fdf17e37120dfc2e251092c5a581d3fc.png)
```html
<textarea id="textarea" class="form-control" maxlength="225" rows="3" placeholder="此文本区域限制为225个字符。">
```
```javascript
$("textarea#textarea").maxlength({
    threshold: 255,
    warningClass: "badge badge-info",
    limitReachedClass: "badge badge-warning"
});
```

模板页面：http://lyear.itshubao.com/v5/lyear_js_maxlength.html

涉及的文件：
- `lyear_js_maxlength.html`
- `js/bootstrap-maxlength/bootstrap-maxlength.min.js`