2つの方法でテキストボックス入力コンテンツプロンプトの消失を実現

3523 ワード

1つ目の方法:
HTML 5 inputタグに基づく新しいプロパティ-placeholder.また,x-webkit-speech属性は音声入力機能を実現できる.
 
  



2つ目の方法:
spanシミュレーションでspanを位置決めし,JSキーボードイベント判定入力によりspan内のコンテンツ表示非表示を決定する.
 
  






<br>$(document).ready(function(){ <br>$("#focus .input_txt").each(function(){ <br>var thisVal=$(this).val(); <br>// , , <br>if(thisVal!=""){ <br>$(this).siblings("span").hide(); <br>}else{ <br>$(this).siblings("span").show(); <br>} <br>// <br>$(this).focus(function(){ <br>$(this).siblings("span").hide(); <br>}).blur(function(){ <br>var val=$(this).val(); <br>if(val!=""){ <br>$(this).siblings("span").hide(); <br>}else{ <br>$(this).siblings("span").show(); <br>} <br>}); <br>}) <br>$("#keydown .input_txt").each(function(){ <br>var thisVal=$(this).val(); <br>// , , <br>if(thisVal!=""){ <br>$(this).siblings("span").hide(); <br>}else{ <br>$(this).siblings("span").show(); <br>} <br>$(this).keyup(function(){ <br>var val=$(this).val(); <br>$(this).siblings("span").hide(); <br>}).blur(function(){ <br>var val=$(this).val(); <br>if(val!=""){ <br>$(this).siblings("span").hide(); <br>}else{ <br>$(this).siblings("span").show(); <br>} <br>}) <br>}) <br>}) <br>