jQuery_jquery に基づいて bootstrapValidator でグローバル検証を実装する-jsチュートリアル-php.cn

jQuery_jquery に基づいて bootstrapValidator でグローバル検証を実装する

WBOY

リリース： 2016-05-16 15:27:16

オリジナル

1081 人が閲覧しました

BootstrapValidator は、Boostrap v3 専用のフォーム検査 jQuery プラグインです。一般的に使用される多くの検査機能を実装でき、拡張が容易で、中国語もサポートしています。ブートストラップユーザーは、そのまま使用できます。

プレフィックス:

jQuery、ブートストラップ、ブートストラップバリデーターの紹介

問題の説明:

このプロジェクトでは、すべてのフォーム入力ボックスに & 記号を入力することはできません。ブートストラップで利用できる方法が見つからなかったので、自分で行う必要がありました

考え:

正規表現を使用します。

1 つ目は、入力ボックスに独自の定期検証がある場合、それについて心配する必要がないということです (一般的に、定期検証は入力を厳密に制御するために使用されます)。正規表現がない場合は、& の正規ルールを入力できないことを追加する必要があります。

上記 2 つの状況に応じて、bootstrapValidator 初期化関数をオーバーロードし、初期化設定を修正する必要があります。最後に、元の bootstrapValidator 関数を復元します (この手順は必要です。元の bootstrapValidator 関数には独自の関連要素が多数あり、失われることはありません)。

実装:

/*add chenhua 2015.10.16 重写bootstrapValidator方法&#63;给每一个验证项都添加禁止输入"&"符号*/ 
$(function(){　　//保存原始的bootstrapValidator 
　　var overwrite = $.fn.bootstrapValidator; 　　//重载bootstrapValidator
　　$.fn.bootstrapValidator = function(options){ 
　　　　//恢复原来的bootstrapValidator，因为其加了很多数据是不能丢失的 
　　　　$.fn.bootstrapValidator = overwrite; 
        　　　　//这里有两种做法，第一种是直接修改arguments内容，使其包含不能输入&的验证，然后调用即可；　　　　//第二种是先使用arguments来初始化，然后使用调用bootstrapValidator的函数来给非正则表达式验证的项添加不能输入&的验证　　　　//这里我们使用了第二中。　　
　　　　var validtor = overwrite.apply(this,arguments); 
　　　　if($.type(arguments[0]) == "object"){ 
　　　　　　var vtor = this.data("bootstrapValidator"),　　　　　　//过滤出输入框表单项　　 
　　　　　　fileds = this.find("input[name][type='hidden'],input[name][type='password'],input[name][type='text'],textarea[name]").not(":disabled,[type='hidden']"); 
　　　　　　fileds.each(function(){ 
　　　　　　　　//本身没有正则验证才添加不能输入&的验证 
　　　　　　　　if(!vtor.getOptions($(this).attr('name'),'regexp','regexp')){ 
       　　vtor.addField($(this).attr('name'), 
　　　　　　　　　　　　{ 
　　　　　　　　　　　　　　validators: { 
　　　　　　　　　　　　　　　　regexp: { 
　　　　　　　　　　　　　　　　　　regexp: /^[^&]*$/, 
　　　　　　　　　　　　　　　　　　message: "不能包含&字符" 
　　　　　　　　　　　　　　　　} 
　　　　　　　　　　　　　　} 
　　　　　　　　　　}) 
　　　　　　　　} 
　　　　　　}) 
　　　　} 
　　　　return validtor; 
　　} 
})

ログイン後にコピー

上記の内容はScript Houseのエディターが導入したjQueryベースのbootstrapValidatorでのグローバル検証です。