无法获得在页面加载时工作的功能，但它在点击时工作。我怎样才能让它在两者上都工作？

Question

我试图在 onLoad 和单击时调用

subSection

函数。但由于某种原因，我的代码只能在 OnClick 上工作，但不能在 OnLoad 上工作，我不知道为什么。

这是我的代码：

fileOne.js

$(function () {
    if ($('.MainSection .folderTab').length) {
 
        subSection($('a.tab.present'));
 
        // calling subSection() on Click.
        $('.MainSection .folderTab a.tab').click(function() {
            subSection($(this));
        });
 
        // calling subSection() on page load.
        $('.MainSection .folderTab a.tab').on( "load", function() {
            subSection($(this));
        });
    }
});

fileTwo.js

function subSection(element) {
    // some code...
}

当前在 Click 上，

subSection

功能已正确触发并且可以正常工作。但我也想在页面加载时调用

subSection

函数，但由于某种原因它不起作用。我是否没有正确调用页面加载时的函数？

我尝试过使用

.on( "load", function()

或直接调用该函数，如下所示：

subSection($(this));

。但这些方法都没有在页面加载时触发该功能。

Answer 1

您需要检查页面加载中是否存在元素或文档是否已准备好，然后使用provi调用它

$(function () {
    if ($('.MainSection .folderTab').length) {
        subSection($('.MainSection .folderTab a.tab'));
    }

});

工作片段：

$(function() {

  $('.MainSection .folderTab a.tab').click(function() {
    alert('clicked');
    subSection($(this));
  });

  if ($('.MainSection .folderTab').length) {
    subSection($('.MainSection .folderTab a.tab'));
  }

});

function subSection(obj) {
  obj.text('I am clicked on load as well');
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
<div class="MainSection">
  <div class="folderTab">
    <a class="tab" href="javascript:void(0);">Click Me!</a>
  </div>
</div>