2017-09-08 7 views
-1

だからこれが起こっている。私はすべてのサイトで私はこのフォームを使用し、どこでも、私が1つのサイトを除いてsendを押すと、空のエラーになる。ここでは、常に上に行く。以下は私のコードですが、私はいくつかを切りました。なぜならそれはあまり重要ではないからです。ブートストラップフォームがエラーにならずに一番上に移動

<!DOCTYPE html> 

    <html lang="nl"> 
    <head> 
    <meta charset="UTF-8"> 
    <!--[if lt IE 9]> 
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
    <![endif]--> 
    <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1.5"> 
    <!-- Form --> 
    <link type="text/css" rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"> 
    <link type="text/css" rel="stylesheet" href="custom.css"> 
    <!-- End Form --> 
    <link type="text/css" rel="stylesheet" href="style.css"> 

    <?php include("fonts.php");?> 

    <script type="text/javascript" src="https://code.jquery.com/jquery-2.2.0.js"></script> 

    <!-- Mobile Menu --> 

    <link href="nav/sandbox.css" rel="stylesheet"> 
    <link href="nav/drawer.css" rel="stylesheet"> 

    <!-- Mobile Menu --> 

    </head> 

    <body class="drawer drawer--left"> 

    <form id="contact-form" method="post" action="send.php" role="form"> 

          Here is my form, this works fine. No problem here, for sure. 


         </form> 




    <!-- Form --> 
      <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> 
      <script src="validator.js"></script> 
      <script src="contact.js"></script> 
    <!-- End form --> 

    </div> 
    </div> 

    <div class="dotted"></div> 
    <?php include("footer.php");?> 
    </div> 


    <script src="https://cdnjs.cloudflare.com/ajax/libs/iScroll/5.1.3/iscroll.min.js"></script> 
    <script src="https://cdn.rawgit.com/ungki/bootstrap.dropdown/3.3.5/dropdown.min.js"></script> 
    <script src="nav/drawer.min.js" charset="utf-8"></script> 
    <script> 
     $(document).ready(function() { 
     $('.drawer').drawer(); 
     }); 
    </script> 

    <script src="jquery.backstretch.min.js"></script> 
    <script> 
     $.backstretch("background.jpg"); 
    </script> 

    </body> 
    </html> 

問題はjqueryのどこかにあるはずです。私は..

<script type="text/javascript" src="https://code.jquery.com/jquery-2.2.0.js"></script> 

を、このいずれかを削除すると、私は私のカスタムエラーのが、標準的なものを取得しないことを除いて..私はほとんど、私が望む結果を得ました。私は真剣にこのサイトがこれで苦労している理由を知らない。 Validator.jsとcontact.jsは私がいつもどこかで使うのと同じです。

希望、誰かがどこ見て回るの解決策を持っている...

EDIT(validator.js)

/* ======================================================================== 
    * Bootstrap (plugin): validator.js v0.10.2 
    * ======================================================================== 

    +function ($) { 
     'use strict'; 

     // VALIDATOR CLASS DEFINITION 
     // ========================== 

     function getValue($el) { 
     return $el.is('[type="checkbox"]') ? $el.prop('checked')          : 
       $el.is('[type="radio"]') ? !!$('[name="' + $el.attr('name') + '"]:checked').length : 
              $.trim($el.val()) 
     } 

     var Validator = function (element, options) { 
     this.options = options 
     this.$element = $(element) 
     this.$inputs = this.$element.find(Validator.INPUT_SELECTOR) 
     this.$btn  = $('button[type="submit"], input[type="submit"]') 
          .filter('[form="' + this.$element.attr('id') + '"]') 
          .add(this.$element.find('input[type="submit"], button[type="submit"]')) 

     options.errors = $.extend({}, Validator.DEFAULTS.errors, options.errors) 

     for (var custom in options.custom) { 
      if (!options.errors[custom]) throw new Error('Missing default error message for custom validator: ' + custom) 
     } 

     $.extend(Validator.VALIDATORS, options.custom) 

     this.$element.attr('novalidate', true) // disable automatic native validation 
     this.toggleSubmit() 

     this.$element.on('input.bs.validator change.bs.validator focusout.bs.validator', Validator.INPUT_SELECTOR, $.proxy(this.onInput, this)) 
     this.$element.on('submit.bs.validator', $.proxy(this.onSubmit, this)) 

     this.$element.find('[data-match]').each(function() { 
      var $this = $(this) 
      var target = $this.data('match') 

      $(target).on('input.bs.validator', function (e) { 
      getValue($this) && $this.trigger('input.bs.validator') 
      }) 
     }) 
     } 

     Validator.INPUT_SELECTOR = ':input:not([type="submit"], button):enabled:visible' 

     Validator.FOCUS_OFFSET = 20 

     Validator.DEFAULTS = { 
     delay: 500, 
     html: false, 
     disable: true, 
     focus: true, 
     custom: {}, 
     errors: { 
      match: 'Does not match', 
      minlength: 'Not long enough' 
     }, 
     feedback: { 
      success: 'glyphicon-ok', 
      error: 'glyphicon-remove' 
     } 
     } 

     Validator.VALIDATORS = { 
     'native': function ($el) { 
      var el = $el[0] 
      return el.checkValidity ? el.checkValidity() : true 
     }, 
     'match': function ($el) { 
      var target = $el.data('match') 
      return !$el.val() || $el.val() === $(target).val() 
     }, 
     'minlength': function ($el) { 
      var minlength = $el.data('minlength') 
      return !$el.val() || $el.val().length >= minlength 
     } 
     } 

     Validator.prototype.onInput = function (e) { 
     var self  = this 
     var $el   = $(e.target) 
     var deferErrors = e.type !== 'focusout' 
     this.validateInput($el, deferErrors).done(function() { 
      self.toggleSubmit() 
     }) 
     } 

     Validator.prototype.validateInput = function ($el, deferErrors) { 
     var value  = getValue($el) 
     var prevValue = $el.data('bs.validator.previous') 
     var prevErrors = $el.data('bs.validator.errors') 
     var errors 

     if (prevValue === value) return $.Deferred().resolve() 
     else $el.data('bs.validator.previous', value) 

     if ($el.is('[type="radio"]')) $el = this.$element.find('input[name="' + $el.attr('name') + '"]') 

     var e = $.Event('validate.bs.validator', {relatedTarget: $el[0]}) 
     this.$element.trigger(e) 
     if (e.isDefaultPrevented()) return 

     var self = this 

     return this.runValidators($el).done(function (errors) { 
      $el.data('bs.validator.errors', errors) 

      errors.length 
      ? deferErrors ? self.defer($el, self.showErrors) : self.showErrors($el) 
      : self.clearErrors($el) 

      if (!prevErrors || errors.toString() !== prevErrors.toString()) { 
      e = errors.length 
       ? $.Event('invalid.bs.validator', {relatedTarget: $el[0], detail: errors}) 
       : $.Event('valid.bs.validator', {relatedTarget: $el[0], detail: prevErrors}) 

      self.$element.trigger(e) 
      } 

      self.toggleSubmit() 

      self.$element.trigger($.Event('validated.bs.validator', {relatedTarget: $el[0]})) 
     }) 
     } 


     Validator.prototype.runValidators = function ($el) { 
     var errors = [] 
     var deferred = $.Deferred() 
     var options = this.options 

     $el.data('bs.validator.deferred') && $el.data('bs.validator.deferred').reject() 
     $el.data('bs.validator.deferred', deferred) 

     function getErrorMessage(key) { 
      return $el.data(key + '-error') 
      || $el.data('error') 
      || key == 'native' && $el[0].validationMessage 
      || options.errors[key] 
     } 

     $.each(Validator.VALIDATORS, $.proxy(function (key, validator) { 
      if ((getValue($el) || $el.attr('required')) && 
       ($el.data(key) || key == 'native') && 
       !validator.call(this, $el)) { 
      var error = getErrorMessage(key) 
      !~errors.indexOf(error) && errors.push(error) 
      } 
     }, this)) 

     if (!errors.length && getValue($el) && $el.data('remote')) { 
      this.defer($el, function() { 
      var data = {} 
      data[$el.attr('name')] = getValue($el) 
      $.get($el.data('remote'), data) 
       .fail(function (jqXHR, textStatus, error) { errors.push(getErrorMessage('remote') || error) }) 
       .always(function() { deferred.resolve(errors)}) 
      }) 
     } else deferred.resolve(errors) 

     return deferred.promise() 
     } 

     Validator.prototype.validate = function() { 
     var self = this 

     $.when(this.$inputs.map(function (el) { 
      return self.validateInput($(this), false) 
     })).then(function() { 
      self.toggleSubmit() 
      self.focusError() 
     }) 

     return this 
     } 

     Validator.prototype.focusError = function() { 
     if (!this.options.focus) return 

     var $input = $(".has-error:first :input") 
     if ($input.length === 0) return 

     $(document.body).animate({scrollTop: $input.offset().top - Validator.FOCUS_OFFSET}, 250) 
     $input.focus() 
     } 

     Validator.prototype.showErrors = function ($el) { 
     var method = this.options.html ? 'html' : 'text' 
     var errors = $el.data('bs.validator.errors') 
     var $group = $el.closest('.form-group') 
     var $block = $group.find('.help-block.with-errors') 
     var $feedback = $group.find('.form-control-feedback') 

     if (!errors.length) return 

     errors = $('<ul/>') 
      .addClass('list-unstyled') 
      .append($.map(errors, function (error) { return $('<li/>')[method](error) })) 

     $block.data('bs.validator.originalContent') === undefined && $block.data('bs.validator.originalContent', $block.html()) 
     $block.empty().append(errors) 
     $group.addClass('has-error has-danger') 

     $group.hasClass('has-feedback') 
      && $feedback.removeClass(this.options.feedback.success) 
      && $feedback.addClass(this.options.feedback.error) 
      && $group.removeClass('has-success') 
     } 

     Validator.prototype.clearErrors = function ($el) { 
     var $group = $el.closest('.form-group') 
     var $block = $group.find('.help-block.with-errors') 
     var $feedback = $group.find('.form-control-feedback') 

     $block.html($block.data('bs.validator.originalContent')) 
     $group.removeClass('has-error has-danger') 

     $group.hasClass('has-feedback') 
      && $feedback.removeClass(this.options.feedback.error) 
      && getValue($el) 
      && $feedback.addClass(this.options.feedback.success) 
      && $group.addClass('has-success') 
     } 

     Validator.prototype.hasErrors = function() { 
     function fieldErrors() { 
      return !!($(this).data('bs.validator.errors') || []).length 
     } 

     return !!this.$inputs.filter(fieldErrors).length 
     } 

     Validator.prototype.isIncomplete = function() { 
     function fieldIncomplete() { 
      return !getValue($(this)) 
     } 

     return !!this.$inputs.filter('[required]').filter(fieldIncomplete).length 
     } 

     Validator.prototype.onSubmit = function (e) { 
     this.validate() 
     if (this.isIncomplete() || this.hasErrors()) e.preventDefault() 
     } 

     Validator.prototype.toggleSubmit = function() { 
     if (!this.options.disable) return 
     this.$btn.toggleClass('disabled', this.isIncomplete() || this.hasErrors()) 
     } 

     Validator.prototype.defer = function ($el, callback) { 
     callback = $.proxy(callback, this, $el) 
     if (!this.options.delay) return callback() 
     window.clearTimeout($el.data('bs.validator.timeout')) 
     $el.data('bs.validator.timeout', window.setTimeout(callback, this.options.delay)) 
     } 

     Validator.prototype.destroy = function() { 
     this.$element 
      .removeAttr('novalidate') 
      .removeData('bs.validator') 
      .off('.bs.validator') 
      .find('.form-control-feedback') 
      .removeClass([this.options.feedback.error, this.options.feedback.success].join(' ')) 

     this.$inputs 
      .off('.bs.validator') 
      .removeData(['bs.validator.errors', 'bs.validator.deferred', 'bs.validator.previous']) 
      .each(function() { 
      var $this = $(this) 
      var timeout = $this.data('bs.validator.timeout') 
      window.clearTimeout(timeout) && $this.removeData('bs.validator.timeout') 
      }) 

     this.$element.find('.help-block.with-errors').each(function() { 
      var $this = $(this) 
      var originalContent = $this.data('bs.validator.originalContent') 

      $this 
      .removeData('bs.validator.originalContent') 
      .html(originalContent) 
     }) 

     this.$element.find('input[type="submit"], button[type="submit"]').removeClass('disabled') 

     this.$element.find('.has-error, .has-danger').removeClass('has-error has-danger') 

     return this 
     } 

     // VALIDATOR PLUGIN DEFINITION 
     // =========================== 


     function Plugin(option) { 
     return this.each(function() { 
      var $this = $(this) 
      var options = $.extend({}, Validator.DEFAULTS, $this.data(), typeof option == 'object' && option) 
      var data = $this.data('bs.validator') 

      if (!data && option == 'destroy') return 
      if (!data) $this.data('bs.validator', (data = new Validator(this, options))) 
      if (typeof option == 'string') data[option]() 
     }) 
     } 

     var old = $.fn.validator 

     $.fn.validator    = Plugin 
     $.fn.validator.Constructor = Validator 


     // VALIDATOR NO CONFLICT 
     // ===================== 

     $.fn.validator.noConflict = function() { 
     $.fn.validator = old 
     return this 
     } 


     // VALIDATOR DATA-API 
     // ================== 

     $(window).on('load', function() { 
     $('form[data-toggle="validator"]').each(function() { 
      var $form = $(this) 
      Plugin.call($form, $form.data()) 
     }) 
     }) 

    }(jQuery); 

問題は、カスタム、私はvalidator.jsを削除する場合ので、aswellどこかここかもしれませんエラーは消えますが、ページがエラーにスクロールして、良い部分が表示されます。

+0

あなたが何を求めているのか不明です。あなたは何を意味しますか?_ "常に上に行く" _それは何ですか"?あなたはどこかでこのオンラインを持っていますか?そうでない場合は、少なくともテスト可能な[mcve]を作成します(PHP、静的HTML、残りの[scripts、stylesheets]はありません)。 – CBroe

+0

SENDを押すと、フォーム/ページが上にスクロールします。しかし、もしそれがあれば、エラーに行くべきです。 – Jorus

+0

私は何かをオンラインにしようとしますが、すべてのjquery拡張機能では難しいです。-_-、あなたが理解できることを願っています。 – Jorus

答えて

0

LMFAO ..問題が見つかりました!私のCSSで私は

overflow:hidden 

を持っていたし、それは、変更を行いました。ですから、あなたのブートストラップフォームに問題がある場合は、まずそれを探してください。

関連する問題