jQuery 取得 HTMLElement attribute 的小問題

原來 jQuery 會快果然是偷吃了很多步呀 😛

昨天在 HappyDesigner meetup 4 上聽 othree 講了 HTML5 及 Web Forms 2.0 之後想來玩玩看,但是 Web Forms 2.0 目前只有 Opera 9 有部份支援,然後我就想試試看 在 Firefox 中有什麼樣的特徵,當然,不支援 Web Forms 2.0 的 firefox 當然會把這個 tag 變成一個文字輸入框(也就是 啦),但是當我用 jQuery 來 select 時:
$('input[type=date]')
卻選擇不到這個 element,如果用:
$('input:eq(0)').attr('type')
拿到的值會是 "text"。

我原本以為是 Firefox 會把不支援的 input type 都自作主張改成 text,但是 othree 跟我在 firebug 中都看到它的 type 還是 date 沒有改變,於是我就換個寫法:
$('input:eq(0)').get(0).getAttribute('type')
這樣就會拿到 "date",所以可見「預設把 type 當作 text」是 jQuery 做的事呀...後來去爬一下 jQuery 的 source,果然 attr() 不是用 getAttribute 來做的呀 ...

  • nio

    原來如此,又解了一個惑。
    我上週也是有遇到,還以為沒給type的input,firefox(或瀏覽器)會給它default = text….

  • 但是如果 $(‘input:eq(0)’).get(0).type 還是 text 喔 XDDD

  • 路過,學習下。

  • roviury

    我會建議給一個class他們
    直接存取$(‘input.date’)

    var arr=$(‘input[type=text]’)
    for(var i=0,t;t=arr[i++];){
    if(t.getAttribute(‘type’)===’date’){t.className+=’ date’}
    }

  • roviury

    上面有人提到,
    $(‘input:eq(0)’).get(0).getAttribute(‘type’)=date
    但$(‘input:eq(0)’).get(0).type=text

    應該是,firefox應該是自動改成text,但getAttribute會取回原本的

    $.fn.extend(attr2:function(a,b){if(!b){return this[0].getAttribute(a)}this.each(function(){this.setAttribute(a,b)});return this;})

  • roviury

    $(‘input’).filter(function(){return this.getAttribute(‘type’)==’date’})