JQuery mCustomScrollbar autoScrollOnFocus

2018-06-25 21:40:19

我有reCaptcha联系表单和使用jQuery mCustomScrollbar插件。

问题： 当我点击/关注reCaptcha字段时，页面会自动滚动到div的顶部。

请参阅Jsfidle上的演示，Jsfiddle上的代码

注意：如果mscrollbar不在jsfiddle上工作，那就是从malihu网站调用js和css的问题。

$(".scroller-back").mCustomScrollbar({
   advanced:{
     updateOnContentResize: true
   }           
});

使用autoScrollOnFocus: false

自动滚动具有焦点的元素（例如，滚动条自动滚动 - 按Tab键时形成文本区域），值为：true，false。

$(".scroller-back").mCustomScrollbar({
   advanced:{
     autoScrollOnFocus: false,
     updateOnContentResize: true
   }           
});

它适用于所有领域焦点不自动滚动， 我如何解决这个问题，而不使用autoScrollOnFocus: false ？

解决了

我使用jQuery focus()和mCustomScrollbar scrollTo

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

代码在Jsffidle上

所以，当焦点（使用点击）recaptcha字段自动滚动到自我。但是当我使用Tab键时它不起作用。我试着警惕

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

这是工作时，选项卡和单击， 我不知道jQuery focus()不与scrollTo自我工作

对于目前来说：

我使用scrollTo与目标ID的提交按钮。

var a=Recaptcha.$("recaptcha_response_field");

$(a).focus(function() {
  $(".scroller-back").mCustomScrollbar("scrollTo","#submit_button");
});

代码在Jsffidle上

$(".scroller-back").mCustomScrollbar("scrollTo", $("#yourdiv"));

链接地址: http://www.djcxy.com/p/72471.html