您已經多次使用相同的選擇器

Question

爲什麼jQuery.lint.js說我多次使用同一個選擇器？

這裏是我的代碼：

var seconds = 20; 

function updateCountdown() { 
    if (seconds === 0) { 
     document.forms[0].submit(); 
    } else { 
     $("#countdown").text("Refresh: " + seconds); 
     seconds = seconds - 1; 
    } 
} 

jQuery(function($) { 
    setInterval("updateCountdown()",1000); 
}); 

它說：

地點：

@http://localhost/js/SubmitForm_Countdown.js:7

@http://localhost/js/SubmitForm_Countdown.js:13

選擇： 「#countdown」

Answer 1

我想這是指$("#countdown").text(...)。你每秒鐘運行一次相同的選擇器。

將它緩存在一個變量中並以這種方式引用它會更有效。

var seconds = 20; 
var $countdown; // variable to store #countdown. 
        // Initialized here so it is in scope of updateCountdown() 

function updateCountdown() { 
    if (seconds === 0) { 
     document.forms[0].submit(); 
    } else { 
      // reference the #countdown element stored in the variable 
     $countdown.text("Refresh: " + seconds); 
     seconds = seconds - 1; 
    } 
} 

jQuery(function($) { 
     // Once document is ready, find the #countdown element, and cache it 
    $countdown = $('#countdown'); 
    setInterval("updateCountdown()",1000); 
}); 

而且，可以說，這是更好/更有效的將updateCountdown函數的命名引用傳遞給setInterval()而不是字符串。

setInterval(updateCountdown,1000); 

---

而且，好像你清除setInterval()一次seconds達到0它不會出現。可能是一個好主意。

var seconds = 20; 
var $countdown; // variable to store #countdown. 
        // Initialized here so it is in scope of updateCountdown() 

var interval; // store reference to the setInterval() 

function updateCountdown() { 
    if (seconds === 0) { 
     document.forms[0].submit(); 
      // clear the setInterval 
     clearInterval(interval); 
    } else { 
      // reference the #countdown element stored in the variable 
     $countdown.text("Refresh: " + seconds); 
     seconds = seconds - 1; 
    } 
} 

jQuery(function($) { 
     // Once document is ready, find the #countdown element, and cache it 
    $countdown = $('#countdown'); 
     // retain reference to the setInterval call 
    interval = setInterval(updateCountdown,1000); 
});