ความคิดเห็น: บทความนี้ส่วนใหญ่แนะนำแอตทริบิวต์ HTML 5 Placeholder เพื่อให้บริการอย่างสมบูรณ์แบบเป็นเช่น เพื่อนที่ต้องการมันสามารถอ้างถึงมันได้
อย่าลืมอ้างอิงห้องสมุดคลาส jQuery$ (เอกสาร) .ready (function () {
if ($. browser.msie)
$ ("อินพุต: ข้อความ, อินพุต: รหัสผ่าน") แต่ละ (ฟังก์ชั่น () {
var $ placeholder = $ (this) .attr ("placeholder");
var $ width = $ (this) .css ("width");
var $ id = $ (นี่) .attr ("id");
var $ height = parseInt ($ (นี่) .css ("ความสูง")) + 6 + "px";
var $ fontsize = $ (this) .css ("Font-size");
var $ fontweight = $ (this) .css ("Font-Weight");
var $ lineHeight = $ ความสูง;
if ($ (นี่) .css ("line-height")! = "ปกติ") {
$ lineHeight = parseInt ($ (นี่) .css ("line-height")) + 6 + "px";
-
if ($ placeholder! = undefined) {
$ (นี่). หลังจาก ("<span class =/" placeholder ph_ " + $ id +"/"style =/" ความกว้าง: " + $ width +"; leight line: " + $ lineHeight +"; ความสูง: " + $ height +"; font-weight: " + $ fontweight +"; $ placeholder + "</span>");
-
$ (นี่). -bind ("keyup", function () {
ถ้า ($ (นี่) .val () == "") {
$ (นี่) .parent (). ค้นหา (". ph_" + $ id) .css ("แสดง", "inline-block");
-
อื่น {
$ (นี่) .parent (). ค้นหา (". ph_" + $ id) .css ("แสดง", "ไม่มี");
-
-
-
$ (". placeholder"). live ("คลิก", function () {
$ (นี่) .prev (). focus ();
-
-
หน้าโทร
<อินพุต type = "text" placeHolder = "ฉันแจ้งให้เนื้อหาเป็นปกติ" />
<อินพุต type = "text" placeholder = "ฉันกำลังแจ้งความกว้างและความสูงของเนื้อหา" />
<อินพุต type = "text" placeholder = "ฉันกำลังแจ้งเนื้อหาฉันมีสไตล์อื่น" />
<input type = "text" placeholder = "คุณสามารถลองใช้อื่น ๆ ได้" />
สไตล์
<style type = "text/css">
. สถานที่ {แสดง: inline-block; สี: สีเทา; แนวตั้ง-แนว: top; overflow: hidden;}
</style>