如何设置页面加载条件或是否单击按钮

Question

我是jquery的新手，在页面加载时我有一些放在里面的程序：

    $(document).ready(function () {
     some function....
      });

我有一个筛选器按钮，当我按下它时，应该执行与页面加载相同的操作，那么我该怎么说呢？如果单击该按钮或页面加载，是否执行相同的操作？

$(document).ready(function() || $("#btn").click(function(){
     some functions.....
 }));

我想要的是合乎逻辑的吗？如果可以，请告诉我该怎么做

Answer 1

您只想单击加载按钮

function yourFunctionName() { .... }

$(function() {
  $("#btn").on("click",yourFunctionName).click()
});

或在两个事件中都调用

function yourFunctionName() { .... }

$(function() {
  yourFunctionName();
  $("#btn").on("click",yourFunctionName);
});

Answer 2

将要运行的逻辑提取到其自己的函数，然后从两个事件中调用它：

$(function() {
  doSomething();

  $("#btn").click(function() {
    doSomething();
  });
});

您还可以提供对处理程序的函数引用，具体取决于您需要在以下程序中运行的范围：

$("#btn").click(doSomething);

Answer 3

您需要将其分成function：

function myEvent(event) {
    //Do something
}

现在，您可以选择自己的方法：

正常，简单的方法：

$(document).ready(function(event) {
    myEvent(event);
    $("#btn").click(myEvent);
});

优势：易于实现和阅读

缺点：当处理程序必须传递到比2个更多的地方时，这种情况不能很好地解决

将处理程序的创建委托给一个函数：

function myHandlerCreator(events) {
    for (event of events) event(myEvent);
}

并这样称呼它：

myHandlerCreator([
    $(document).ready,
    $("#btn").click
]);

优势：非常易于维护且易于使用，可以很好地应对很多事件需要处理或频繁更改输入的情况

缺点：创建了一个新的逻辑层