Heim > Web-Frontend > js-Tutorial > Implementieren Sie eine globale Validierung unter BootstrapValidator basierend auf jQuery_jquery

Implementieren Sie eine globale Validierung unter BootstrapValidator basierend auf jQuery_jquery

WBOY
Freigeben: 2016-05-16 15:27:16
Original
1106 Leute haben es durchsucht

BootstrapValidator ist ein jQuery-Plug-in zur Formularinspektion speziell für Boostrap v3. Es kann viele häufig verwendete Inspektionsfunktionen implementieren, ist einfach zu erweitern und unterstützt auch Chinesisch! Es kann sofort für Bootstrap-Benutzer verwendet werden.

Präfix:

Einführung in jQuery, Bootstrap, BootstrapValidator

Problembeschreibung:

Das Projekt erfordert, dass das &-Symbol nicht in allen Formulareingabefeldern eingegeben werden kann. Ich habe in Bootstrap keine verfügbare Methode gefunden, also musste ich es selbst tun

Denken:

Verwenden Sie reguläre Ausdrücke.

Es gibt zwei Situationen: Wenn das Eingabefeld über eine eigene regelmäßige Überprüfung verfügt, müssen Sie sich darüber keine Sorgen machen (im Allgemeinen wird die regelmäßige Überprüfung zur strengen Kontrolle der Eingabe verwendet). Wenn kein regulärer Ausdruck vorhanden ist, müssen Sie hinzufügen, dass Sie die reguläre Regel von & nicht eingeben können.

Es ist notwendig, die BootstrapValidator-Initialisierungsfunktion zu überlasten und die Initialisierungseinstellungen entsprechend den beiden oben genannten Situationen zu korrigieren. Stellen Sie abschließend die ursprüngliche BootstrapValidator-Funktion wieder her (dieser Schritt ist notwendig, da die ursprüngliche BootstrapValidator-Funktion viele eigene Dinge enthält, die nicht verloren gehen können).

Implementierung:

/*add chenhua 2015.10.16 重写bootstrapValidator方法?给每一个验证项都添加禁止输入"&"符号*/ 
$(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; 
  } 
}) 
Nach dem Login kopieren
Der obige Inhalt ist die vom Herausgeber von Script House eingeführte globale Überprüfung unter BootstrapValidator basierend auf jQuery.


Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage