JQuery mCustomScrollbar autoScrollOnFocus

前端之家收集整理的这篇文章主要介绍了JQuery mCustomScrollbar autoScrollOnFocus前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有与reCaptcha的联系表单并使用jQuery mCustomScrollbar插件.

问题:当我点击/关注reCaptcha字段时,页面自动滚动到div的顶部.

Demo on Jsffidle,Code on Jsfiddle

注意:如果mscrollbar没有在jsfiddle上工作,那就是从malihu网站调用js和css的问题.

  1. $(".scroller-back").mCustomScrollbar({
  2. advanced:{
  3. updateOnContentResize: true
  4. }
  5. });

使用autoScrollOnFocus:false

Auto-scrolling on elements that have focus (e.g. scrollbar
automatically scrolls-to form textfields when the TAB key is pressed),
values: true,false.

  1. $(".scroller-back").mCustomScrollbar({
  2. advanced:{
  3. autoScrollOnFocus: false,updateOnContentResize: true
  4. }
  5. });

它适用于所有领域焦点不自动滚动,如何在不使用autoScrollOnFocus的情况下修复此问题:false?

解决方法

解决

我使用jQuery focus()和mCustomScrollbar scrollTo

  1. $("#recaptcha_response_field").focus(function() {
  2. $(".scroller-back").mCustomScrollbar("scrollTo",this);
  3. });

Code on Jsffidle

所以,当焦点(使用点击)recaptcha字段自动滚动到自己.但是当我使用tab键时它不起作用.我试着提醒

  1. $('#recaptcha_response_field').focus(function() {
  2. alert('Handler for .focus() called.');
  3. });

选项卡和单击时它的工作,我不知道jQuery focus()不使用scrollTo self

目前:

我正在使用带有目标ID提交按钮的scrollTo.

  1. var a=Recaptcha.$("recaptcha_response_field");
  2.  
  3. $(a).focus(function() {
  4. $(".scroller-back").mCustomScrollbar("scrollTo","#submit_button");
  5. });

Code on Jsffidle

猜你在找的jQuery相关文章