从 autosize.js 调用函数来更新 swiper.js答案

【问题标题】：Call function from autosize.js to update swiper.js从 autosize.js 调用函数来更新 swiper.js
【发布时间】：2017-12-12 15:54:22
【问题描述】：

我正在寻找一种从 autosize.js（旧版本）更新 swiper.js 的方法。

更详细的：

我在 swiper 中有一个自动调整大小的文本区域。刷卡器设置为自动高度。这意味着文本区域位于设置为overflow:hidden 的滑动幻灯片中。现在，当 textarea 改变高度时，幻灯片高度没有改变，并且由于 overflow:hidden 我的部分内容被切断了。

为了解决这个问题，我想在 textarea 的高度发生变化时更新幻灯片高度。

在 autosize.js 插件中有一部分（从第 178 行开始）设置了高度：

 if (original !== height) {
     ta.style.height = height + 'px';
     if (callback) {
         options.callback.call(ta,ta);
     }

     /* send trigger to update slide here */
 }

当这部分发生时，我想在插件外部发送一个触发器来更新滑动幻灯片。我有一个功能（没什么花哨的）。

function updateSwiper(){
    mySwiper.update();
}

插件和自定义函数（上图）在同一个文件中。

所以现在我想知道，我该如何解决这个问题？提前致谢。

【问题讨论】：

我想你找不到它，因为它有点奇怪。插件应该是一个独立的工作单元。通过从插件内部调用外部函数，您破坏了封装。
欢迎来到 Stack Overflow！请使用tour，环顾四周，并通读help center，尤其是How do I ask a good question?，我们无法为您提供我们看不到的代码。请使用minimal reproducible example 更新问题以证明问题。通常，从内部作用域调用外部作用域中的函数非常简单：您只需调用它们即可。
考虑传递in一个函数指针并在适当的时候执行它。当您设置插件时，此回调函数可以调用您的外部功能。
啊，好吧，我想要的是在插件中的值发生更改时调用一个函数。这可能吗？是否可以从插件中输出值并进行跟踪？
Anything 在插件中是可能的。您需要使用一些相关代码更新您的问题，并准确解释您想要做什么 - 因为您的问题太宽泛了。阅读@T.J.Crowder 评论。

标签： jquery jquery-plugins

【解决方案1】：

在所有 cmets 中，我的研究最终发现我使用的是旧版本的 autosize.js。新版本有一个触发器，用于更改文本区域的高度。可以在本文档中阅读：Autosize Documentation

要在 jQuery 中解决这个问题，您可以使用以下代码：

$('textarea').each(function(){
  autosize(this);
}).on('autosize:resized', function(){
  console.log('textarea height updated');
});

此代码首先将 autosize 设置为 textarea 并使用 on('autosize.resized') 来跟踪高度是否更改。

将此代码更新为我的版本：

 $('textarea').each(function(){
   autosize(this);
 }).on('autosize:resized', function(){
   updateSwiper();
 });

解决了我的问题，谢谢大家。

【讨论】：