input:text または textarea に入力可能な最大文字数を設定出来ます。
MTAppMaxLength を適用するとそのフィールドに入力した文字数がリアルタイムで計測され、その文字数に応じて入力欄の右上に下記のようなステータスメッセージが表示されます。
使い方
$(foo).MTAppMaxLength(options);
foo には MTAppMaxLength を適用させたい1行テキスト入力欄または複数行テキスト入力欄のセレクタを設定し、options には後述のオプションを設定します。
サンプル
例えば、タイトル欄の最大文字数を20字にする場合は、下記のコードを user.js に記述します。
$('#title').MTAppMaxLength({
"maxLength": 20,
"eachAlert": true
});
【例】最大文字数を20字に設定した場合
- 何も入力していないとき
- 5文字入力した場合
- 25字入力したとき
最大値を超えたたまま保存しようとするとアラートが表示され、最大文字数以内に修正しないと保存出来なくなります。
オプション
$(foo).MTAppMaxLength({
"maxLength": 0,
"addAttr": false,
"overStyle": {
border: '1px solid #ff0000',
color: '#ff0000'
},
"overStatusStyle": {
color: '#ff0000'
},
"viewCount": true,
"eachAlert": false
});
maxLength 必須
Type : Number, Default : 0
最大文字数を設定します。1 以上の数字を設定してください。
addAttr
Type : Boolean, Default : false
true を設定すると MTAppMaxLength を適用した入力欄に maxlength 属性を追加することができます。
overStyle
Type : Plane Object, Default : {
border: '1px solid #ff0000',
color: '#ff0000'
}
最大文字数を超えたときの入力欄に適用される CSS プロパティを設定します。ここで設定したオブジェクトがjQuery の .css() に渡されます。
overStatusStyle
Type : Plane Object, Default : {
color: '#ff0000'
}
最大文字数を超えたときのステータスメッセージに適用される CSS プロパティを設定します。ここで設定したオブジェクトがjQuery の .css() に渡されます。
viewCount
Type : Boolean, Default : true
false を設定するとステータスメッセージが表示されなくなります。
eachAlert
Type : Boolean, Default : false
保存時のアラートの種類を設定します。
デフォルト（ false ）では、最大文字数を超えている入力欄が存在すると「最大文字数を超えている入力欄があります。」というアラートが表示されます。
true を設定すると最大文字数を超えているフィールド毎に「○○欄 : 最大文字数を超えています。」というアラートが表示されます。