[jQuery] 日曆時間外掛 timepicker CSS/Offset 問題 | Plugins

最近把之前弄的 jQuery 日期外掛拿出來看看,筆記過兩篇:[jQuery筆記] 時間日期外掛:timepicker | jQuery Plugins[jQuery筆記] 好用的日期函式 datepicker,目前在寫活動的開始時間跟結束時間會用到這兩個外掛,網路上有找到整合日期跟時間的程式,不過效果都不是我很喜歡,因為在時間方面想要設定可以分隔5分鐘,或者是10分鐘間隔,有沒有網友可以提供更好的 jQuery 外掛,可以將日曆跟時間整合在一起,用單一 input 欄位就可以控制,也可以設定間隔時間,目前是搭配這兩個外掛同時使用,也可以達到同樣效果。 timepicker 作者網站,愈到了一個問題,只要網頁裡面有用到 jQuery Showhide 都會讓 timepicker 程式判斷 CSS/offset 發生錯誤,導致功能無法顯示在正確的地方,會跑到網頁其他位置,解決方法就是當滑鼠 click input 欄位時,再去呼叫取得目前 offset 的位置。
var elmOffset = $(elm).offset();
$tpDiv.appendTo('body').css({'top':elmOffset.top + 'px', 'left':elmOffset.left+ 'px'}).hide();
這樣就可以正確顯示在 input 下方,連這個都可以遇到地雷 XD
  • 看着挺不错的样子.

  • Pingback: 網站製作學習誌 » [Web] 連結分享()

  • JJ

    請問
    var elmOffset = $(elm).offset();
    $tpDiv.appendTo(‘body’).css({‘top’:elmOffset.top + ‘px’, ‘left’:elmOffset.left+ ‘px’}).hide();

    $(elm).offset(); 這句話是什麼意思呢
    第二行的意思我也不太明白
    試過後失敗了
    請問您可以解釋一下嗎?

  • k1

    thank’s lot
    this my solution:
    jquery.timepicker.js
    line55: delete
    line56: change to $tpDiv.appendTo(‘body’).hide();
    line85: add var elmOffset = $(elm).offset();
    line86: $tpDiv.css({‘top’:elmOffset.top, ‘left’:elmOffset.left}).show();

  • 是转载的,还是原创啊

  • 好热闹