drupal js在不退出主脚本的情况下执行另一个js函数？答案

【问题标题】：drupal js executing another js function without exiting main script?drupal js在不退出主脚本的情况下执行另一个js函数？
【发布时间】：2018-04-11 16:38:14
【问题描述】：

我从加载节点折叠的常见问题模块中获得 js，“faq-answer ... collapsable collapsed”和切换时“faq-answer ... collapsable”（“collapsed”消失）。

我怀疑由于 .collapsed 包含 'display: none;' 不会触发图像的延迟加载脚本。

因此，我试图在切换任何常见问题后执行该脚本lazy.js，但无法使其工作。

A) 在lazy.js 中，我给它起了一个名字(function runblazy($) {，在faq.js 中，我在$(this).next('div.faq-dd-hide-answer').toggleClass("collapsed"); 之后插入了runblazy();，但这会中断整个脚本，从而阻止页面正确加载，即。渲染链接等。

B) 当“collapsed”类消失时，我也尝试运行它，但它只运行一次（在页面加载期间），我也不知道如何使它与 while 循环一起工作

var x = document.getElementsByClassName("faq-answer");
if (x[0].classList.contains("collapsed")) { //do nothing }
else { runblazy(); }

哪种方法更好/正确，我错过了什么？ 这是来自 faq.js 的 js：

(function ($) {

 Drupal.behaviors.initFaqModule = {
  attach: function (context) {
   // Hide/show answer for a question.
   var faq_hide_qa_accordion = Drupal.settings.faq.faq_hide_qa_accordion;
   $('div.faq-dd-hide-answer', context).addClass("collapsible collapsed");

   if (!faq_hide_qa_accordion) {
     $('div.faq-dd-hide-answer:not(.faq-processed)', context).addClass('faq-processed').hide();
   }
   $('div.faq-dt-hide-answer:not(.faq-processed)', context).addClass('faq-processed').click(function() {
     if (faq_hide_qa_accordion) {
      $('div.faq-dt-hide-answer').not($(this)).removeClass('faq-qa-visible');
     }
     $(this).toggleClass('faq-qa-visible');
     $(this).parent().addClass('faq-viewed');
     $('div.faq-dd-hide-answer').not($(this).next('div.faq-dd-hide-answer')).addClass("collapsed");
     if (!faq_hide_qa_accordion) {
       $(this).next('div.faq-dd-hide-answer').slideToggle('fast', function() {
        $(this).parent().toggleClass('expanded');
       });
     }
     $(this).next('div.faq-dd-hide-answer').toggleClass("collapsed"); 
//ADD "runblazy();" HERE?    
     // Change the fragment, too, for permalink/bookmark.
     // To keep the current page from scrolling, refs
     // http://stackoverflow.com/questions/1489624/modifying-document-location-hash-without-page-scrolling/1489802#1489802
     var hash = $(this).find('a').attr('id');
     var fx, node = $('#' + hash);
     if (node.length) {
       fx = $('<div></div>')
         .css({position: 'absolute', visibility: 'hidden', top: $(window).scrollTop() + 'px'})
         .attr('id', hash)
         .appendTo(document.body);
       node.attr('id', '');
     }
     document.location.hash = hash;
     if (node.length) {
       fx.remove();
       node.attr('id', hash);
     }

     // Scroll the page if the collapsed FAQ is not visible.
     // If we have the toolbar so the title may be hidden by the bar.
     var mainScrollTop = Math.max($('html', context).scrollTop(), $('body', context).scrollTop());
     // We compute mainScrollTop because the behaviour is different on FF, IE and CR
     if (mainScrollTop > $(this).offset().top) {
       $('html, body', context).animate({
         scrollTop: $(this).offset().top
        }, 1);
     }
     return false;

 });

【问题讨论】：

标签： javascript drupal drupal-7

【解决方案1】：

我几乎不敢相信，经过几个小时的尝试，我发现了一个非常简单的解决方法。

我记得我怀疑 display:none 是延迟加载无法正常工作的问题，read here 应该避免这种情况，因此将 .css 更改为使用以下内容可以代替：

.faq .collapsed {
 /*display: none;*/
 position: absolute !important;
 top: -9999px !important;
 left: -9999px !important;
}

如果根据问题在切换后有另一种方法来运行lazy.js，我仍然会感兴趣吗？

【讨论】：