jquery 从 Package 器函数检测按钮何时被点击

sd2nnvve 于 2023-05-06 发布在 jQuery

关注(0)|答案(2)|浏览(132)

我有一个简单的脚本，我用它来过滤一些结果，点击一个按钮。
这是我在使用它的每个页面上调用此脚本的方式：

myScript();

然后脚本是：（这只是脚本的一部分，实际上脚本本身是一个很长的脚本，在按钮点击之前做一些更多的事情）

function myScript() {
       
  // .. other part of the script ..
    
  $("button.my-script.filter-button").on("click", filter)
    
  function filter() {
    let filters;
    // calculating the filters . . .
    // return filters;        
  }
}

我想让这个脚本在每个页面上都能全局工作，并在单击带有类.my-script和.filter-button的按钮时触发它。但是，我如何检测filter()方法何时被调用并方便地获得结果呢？
因为当它在 Package 器中时，我无法控制它（我希望其他需要使用此脚本的人能够在不修改脚本代码的情况下获得过滤器结果）

jquery

来源：https://stackoverflow.com/questions/76140522/detecting-when-button-is-clicked-from-the-wrapper-function

2条答案

按热度按时间

rjzwgtxy1#

这个问题没有提供关于你的脚本应该如何工作的细节，它应该有多灵活，它应该被示例化以提供独立的示例，还是作为一个单例，你是想使用发布/订阅模式，还是只使用jQuery的.trigger()等等。实际上有很多方法，在实现和使用上都不同。
为了尽可能接近您的需求和所提供的代码，我认为您只是想允许开发人员使用您的脚本，如script()- set and forget。
如果是这种情况，您可能希望提供一个options对象参数，其中包含开发人员可以使用的所需方法，例如：

function myScript(options) {
  
  const opt = Object.assign({
    selector: ".my-script.filter-button",
    onFilter: () => {},
  }, options);
  
  // ... other part of the script ...
  
  function filter() {
    let filters = [1,2,3]; // Calculating the filters...
    opt.onFilter(filters);
  }
  
  $(opt.selector).on("click", filter);
}

// Usage
myScript({
  onFilter: (data) => {
    console.log(`My filters are: ${data}`);
  }
});

<button class="my-script filter-button">FILTER</button>
<script src="https://code.jquery.com/jquery-3.6.4.js"></script>

使用上述方法，如果开发人员在HTML中更改按钮选择器，他可以轻松地提供新的选择器，如：

// Usage
myScript({
  selector: "#myFilterButton",
  onFilter: (data) => {
    console.log(`My filters are: ${data}`);
  }
});

如果开发人员不想读取过滤器数据，并且对默认参数很满意，他仍然可以使用最小格式的脚本，如

// Usage
myScript();

了解更多关于不同JavaScript模式的信息：https://www.patterns.dev/posts

赞(0）回复(0）举报 2023-05-06

yc0p9oo02#

你可以从绑定的事件中提取过滤器函数并使其全局化…并在绑定的事件中调用相同的函数
我希望这会有所帮助。

赞(0）回复(0）举报 2023-05-06

我来回答

jquery 从 Package 器函数检测按钮何时被点击

2条答案

相关问题

热门标签

最新问答