[jQuery] ie8 元素id與js變數產生衝突

今天程式發生了一個IE8 bug，因使用js來做前端的i18n，但同事有把元素的id取得跟i18n js的變數一樣，導致js錯誤發生。

 HTML
<span id=”stupid_ie_8”></span>

//i18n key
stup_ie_8 = “IE好弱”;

//script
$(“#stupid_ie_8”).html(stup_ie_8);

[jQuery] append function error in IE8

今天被fire一個bug，有關於append元素的時候，畫面沒有被顯示。
主要是append的元素結構沒有正常的結尾，ie8無法自動修正。

一般html頁面元素沒有正常結尾也會空白

[jQuery API] 拍賣倒數計時器 min seconds: 倒數十下

現在所有團購網都流行的倒數計時器方法，參考至某團購網站XD

$(function() {
    setInterval(function () {
  var m = parseInt($('#mis').text());
  //console.log("start m:" + m);
  if (isNaN(m)) {
   $('#mis').text('0');
  } else {
   m=m+10;
   //console.log("m:" + m);
   if (m>=10) { 
    m=m-1;   
    if(m>=10)
    {
     $('#mis').text(m-10);
    }
    else
    {
     $('#mis').text(m);
    }
   } 
  }
 }, 100);//setInterval
 });  

[jQuery plugin] jquery Validator表單驗證器 番外篇(進階一點的需求吧XD)

Validator真是好物呀，先前有整理一個入學篇，覺得篇福愈來愈長了，
遇到的新問題就記在這篇吧!!

Q.如何指定要特地驗證某一個欄位
有時候你只想要透過別的動作來檢查某個欄位，可以使用valid方法，回傳值為1:驗證通過,0:驗證失敗

var validateForMoney = $("#borrowMoney").valid()//1:ok,0:false
$.console("validateForMoney:" + validateForMoney);
var validateForRate = $("#borrowRate").valid();
$.console("validateForRate:" + validateForRate);

Q.取得全部驗證失敗的欄位有哪些?
//透過numberOfInvalids方法就會回傳數字了，$validatedPostBorrow是我驗證器的變數

$.console("invalid fields:" + $validatedPostBorrow.numberOfInvalids());

Reference:
jQuery Validate Plugin - Trigger validation of single field

[Javascript] JavaScript 物件導向的寫法

Javascript物件寫法真是多到爆，希望多看能找出一些寫起來易都跟維護的程式。

順便在這篇記錄一下。

JavaScript 物件導向的寫法

[jQuery plugin] 來個倒數計時器吧

倒數計時器能增加使用者有感的提示XD常用到拍賣商品上的特效。
找了幾個現成的元件
請參考以下這篇網誌的20以上的jQuery countdown plugins (有擷圖)
http://www.tripwiremagazine.com/2012/05/jquery-countdown-scripts.html

[jQuery API] 實作Facebook的捲軸拉到底更新資訊 Facebook like scroll bar detection

如何使用jQuery偵測捲軸的位置！！ 實作Facebook like的更新狀態列記錄

$(function () {
             var $win = $(window);

             $win.scroll(function () {
                 if ($win.scrollTop() == 0)
                     alert('Scrolled to Page Top');
                 else if ($win.height() + $win.scrollTop()
                                == $(document).height()) {
                     alert('Scrolled to Page Bottom');
                 }
             });
         });

Here's some explanation:

$(window).height() - returns height of browser viewport

$(document).height() - returns height of HTML document

$(window).scrollTop() – returns the current vertical position of the scroll bar.

So if the scroll bar is at the very top, the value of $(window).scrollTop() will be Zero. Similarly if the value of the browser viewport + vertical position of scroll bar = document height, then the user has scrolled to the bottom of the page.

寫成外掛的方式來看看!!

[jQuery plugin] Waypoints

幫助你簡單的控制捲軸到指定的位置

http://imakewebthings.com/jquery-waypoints/#documentation