2016-09-14 62 views
1

我使用的是我用狡猾的工具darsa.in創建的日期選擇器,除了如果用戶改變日子過快之外,一切都是完美的,JavaScript不會爲該功能觸發正確的日期。等待一些東西停止觸發功能

是否有這樣做的方式:

if (datepicker not active for x seconds) 

還是有一種方式來創建一個變量,並觸發只有在該變量不中×時間改變功能?我需要給JS一些時間,所以它不會觸發該函數,直到用戶在他的目標日期之前。

一些代碼如下。

當一天中的選取器發生變化時,我打電話給loadDateMatches(),它將所有的匹配裝載到HTML中。但是,如果你改變,例如,很快1天和5日之間,它可能會停止加載在天數3

我正在尋找一種方式來觸發功能的匹配loadDateMatches(),直到有有有一段時間沒有改變日期。

days.on('active', function (eventName) { 
    activeDate= this.rel.activeItem; 
    var logDate = new Date(d.getFullYear(), 0, activeDate + first + 1); 
    var startTime = new Date(logDate.getFullYear(), logDate.getMonth(), logDate.getDate(), 0, 0, 0); 
    DayBarConditions.startTime = startTime.getTime()/1000; 
    var endTime = new Date(logDate.getFullYear(), logDate.getMonth(), logDate.getDate(), 23, 59, 59); 
    DayBarConditions.endTime = endTime.getTime()/1000; 
    if (typeof loadDateMatches == 'function') { 
     loadDateMatches(); 
    } 
}); 
+0

你可以添加一些代碼,讓人們可以看到你想要做什麼? – httpNick

+0

我加了它,但無論如何,我知道很難承認我正在弄的東西。我的英語並不完美對不起 –

+0

嘗試使用datepicker附帶的選擇功能 - http://api.jqueryui.com/datepicker/#option-onSelect - 與close功能結合使用。有了這兩個函數,你可以停止執行其他函數 – Tasos

回答

0

嘗試具有日期選取呼籲,首先檢查組當天是否相同,當它被改變,然後加載信息,如果這樣的延遲的功能。我相信下面的代碼應該是功能性的,但它沒有經過測試。

days.on('active', function (eventName) { 
    activeDate= this.rel.activeItem; 

    // We have to put this in a separate function, so that it evaluates activeDate 
    // when the date picker is changed, not when activateDelayed is called 
    (function(activeDate) { 
     //Activate the function after .5 seconds if date remains unchanged 
     window.setTimeout(activateDelayed, 500, activeDate); 
    })(activeDate); 
}; 
function activateDelayed (oldDate) { 
    activeDate = days.rel.activeItem; 
    if (oldDate == activeDate) { 
     var logDate = new Date(d.getFullYear(), 0, activeDate + first + 1); 
     var startTime = new Date(logDate.getFullYear(), logDate.getMonth(), logDate.getDate(), 0, 0, 0); 
     DayBarConditions.startTime = startTime.getTime()/1000; 
     var endTime = new Date(logDate.getFullYear(), logDate.getMonth(), logDate.getDate(), 23, 59, 59); 
     DayBarConditions.endTime = endTime.getTime()/1000; 
     if (typeof loadDateMatches == 'function') { 
      loadDateMatches(); 
     } 
    } 
}); 
0

您可以使用此代碼,它會跟蹤你必須執行loadDateMatches請求的數量。當它是第一個時,函數立即執行,但請求計數器不會減少,直到冷卻時間過去。只有這樣,櫃檯纔會減少。當該計數器爲1時,可以添加另一個請求,但只有在第一次冷卻時間到期時纔會執行。在這段冷卻時間段任何更多的要求不會改變任何東西 - 在一個最請求將被掛起執行降溫後:

var requests = 0; 

days.on('active', function (eventName) { 
    // ... your existing code, setting DayBarConditions properties, comes here. 
    // ... 
    if (typeof loadDateMatches == 'function') { 
     // Keep track of number of requests    
     if (requests < 2) requests++; 
     // Ignore this when there is currently a cool-down ongoing, and 
     // another execution is already pending: 
     if (requests == 2) return; 
     (function loop() { 
      loadDateMatches(); 
      setTimeout(function() { 
       // Cool down has passed: repeat when new request is pending 
       if (--requests) loop(); 
      }, 500); 
     })(); 
    } 
}); 

所以,這段代碼不會耽誤第一個請求,而是引入一個冷靜期,在此期間,任何進一步的請求將被合併爲一個,並且只有在冷卻期結束時纔會執行。

但是根據您在loadDateMatches中運行的代碼,可能會有更好的解決方案。