1. 首頁
  2. 問答
  3. 輸入字段焦點後的工具提示

輸入字段焦點後的工具提示

2011-01-27 71 views
0

我確定有一個適當的術語，但不知道它。當用戶在每個領域時，如何彈出小筆記？讓我們假設他們去名字領域;那麼只要他們點擊右側的姓名字段，我想要一個小筆記給他們一個信息，如「確保您使用全名」。我想爲我的幾個領域做到這一點。我怎樣才能做到這一點？輸入字段焦點後的工具提示

來源

2011-01-27 AAA

+1

給我們一個網站的例子，它可以滿足您的需求。這樣我們可以給你特定的代碼，甚至破譯其他人如何做。 – 2011-01-27 05:37:19

回答

1

FlowPlayer.org有一個很好的jQuery工具提示插件，您可以使用。

檢查this使用它的窗體上的演示（它適合你的要求）

來源

2011-01-27 04:42:34

1

下面是一個簡單的例子：粘貼在這裏以供參考太http://jsbin.com/iruyo3

代碼。

<!doctype html> 
<html> 
    <head> 
    <title></title> 
    <style type="text/css"> 
     html,body,h1,h2,h3,h4,h5,p,ul,li,form,button { margin:0; padding:0 } 
     body { font:normal 62.5% tahoma; margin:20px } 

     #myForm .note { display:none; } 
     #myForm fieldset { border:0 } 
     #myForm label { width:100px; float:left; height:25px; line-height:25px; text-align:right; padding-right:10px } 


    </style> 
    </head> 
    <body> 

    <form id="myForm"> 

     <fieldset> 
     <label>Name</label> 
     <input type="text" name="fullname"> 
     <span class="note">Enter your full name.</span> 
     </fieldset> 

     <fieldset> 
     <label>Company</label> 
     <input type="text" name="fullname"> 
     <span class="note">Enter your work place.</span> 
     </fieldset>  

    </form> 

    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript" charset="utf-8"></script> 
    <script type="text/javascript"> 
    $(function() { 
     $('#myForm input:text').focus(function(){ 
     $('.note').hide(); 
     $(this).next().fadeIn(); 
     }); 
    }); 
    </script> 
    </body> 
</html>

來源

2011-01-27 05:46:08

相關問題

 相關問題