javascript - 基于布尔条件执行多个 javascript 文件

Question

我的 WordPress 网站中有大约 5 个 javascript 文件，我尝试根据布尔条件一个一个地执行它们。

tag1.js如果计数为 0 ，则JavaScript 调用。如果tag2.js计数为 1，依此类推。

如果计数达到 4，则计数重置为 0。因此不断重复。我试过这段代码。但即使是第一次也行不通。

jQuery(document).ready(function( $ ) {
   var canClick = true;
   var count= 0;
   $("body").click(function () {
       if (canClick) {
           if(parseInt(count) === 0) {
                $.getScript("https:example.com/custom_js/atag1.js");  
            }
            else if(parseInt(count) === 1) {
                $.getScript("https:example.com/custom_js/atag2.js");  
            }
            else if(parseInt(count) === 2) {
                $.getScript("https:example.com/custom_js/atag3.js");  
            }
            else if(parseInt(count) === 3) {
                $.getScript("https:example.com/custom_js/atag4.js");  
            }
            else if(parseInt(count) === 4){
                $.getScript("https:example.com/custom_js/atag5.js");
                count=0;
             }            
            canClick = false;
            setTimeout(() => {
              canClick = true
            },10000);
           count = parseInt(count)+1;
       }
    });
});

基本上，如果用户在超时区分点击的页面上单击，则此代码将执行每个 javascript。

标签： javascriptjquery

Answer 1

If you want to load the script as per the number of clicks. Then you can look at this solution which will look more precise.

var clicks = 0;
document.addEventListener('click', () => {
  loadJS();
  ++clicks;
});


function loadJS() {
  if (clicks === 4) {
     clicks = 0;
  }
  switch (clicks) {
    case 0:
        console.log('load first js');
        break;
    case 1:
        console.log('load second js');
        break;
    case 2:
        console.log('load 3rd js');
        break;
    case 3:
        console.log('load 4th js');
        break;
    case 4:
        console.log('load 5th js');
        break;
    default:
    // code block
 }
}

working demo