xul:textbox のプレースホルダー文字列

modest に投稿した記事と同内容です。

注意: この記事は Firefox 3.7 での新機能について触れています。

HTML のテキストボックス

Firefox 3.7a5pre では HTML 5 の仕様である placeholder 属性 が実装されており、以下のようにしてテキストボックスにヒント用文字列を表示させることができます。

<input type="text" placeholder="Your Name">

XUL のテキストボックス

一方、 XUL の textbox 要素では Firefox 3.0 にてすでに同様の機能が emptytext 属性として実装済みですが、 Firefox 3.7a5pre では placeholder 属性でもヒント用文字列を表示することができます。互換性維持のため emptytext 属性も引き続き利用可能ですので、 Firefox 3.6 と 3.7 両対応の拡張機能などでは emptytext 属性を使用したほうが良いでしょう。

<textbox emptytext="Your Name" />
<textbox placeholder="Your Name" />

また、以下のように xul:textbox 要素の emptyText (大文字小文字に注意)および placeholder プロパティを使って JavaScript で動的にヒント用文字列をセットすることも可能です。

document.getElementById(...).emptyText = "Your Name";
document.getElementById(...).placeholder = "Your Name";

TOP

1 Comment to “xul:textbox のプレースホルダー文字列”

[…] SCRAPBLOG : xul:textbox のプレースホルダー文字列 http://www.xuldev.org/blog/?p=598 – view page – cached 一方、 XUL の textbox 要素では Firefox 3.0 にてすでに同様の機能が emptytext 属性として実装済みですが、 Firefox 3.7a5pre では placeholder 属性でもヒント用文字列を表示することができます。互換性維持のため emptytext 属性も引き続き利用可能ですので、 Firefox 3.6 と 3.7 両対応の拡張機能などでは… Read more一方、 XUL の textbox 要素では Firefox 3.0 にてすでに同様の機能が emptytext 属性として実装済みですが、 Firefox 3.7a5pre では placeholder 属性でもヒント用文字列を表示することができます。互換性維持のため emptytext 属性も引き続き利用可能ですので、 Firefox 3.6 と 3.7 両対応の拡張機能などでは emptytext View page Tweets about this link Topsy.Data.Twitter.User['azu_re'] = {"location":"","photo":"http://a1.twimg.com/profile_images/660061378/3ce9edfa9aa06f2d118fc9a0d6c36de3_normal.png&quot;,"url":"http://twitter.com/azu_re&quot;,"name":"azu","nick":"azu_re","description":"FirefoxでWebをめぐってることが多いです。 ニコニコ中毒でもある。 http://wrapper.wiki.zoho.com/ を弄ってます。 40post/day","influence":"Influential"}; azu_reInfluential: “プレースホルダついたのか。 「Firefox 3.7a5pre」 "xul:textbox のプレースホルダー文字列" http://is.gd/bR9CF ” 27 minutes ago view tweet retweet Filter tweets […]

TOP

TOP