テキストボックスの入力内容プロンプトを非表示にする 2 つの方法_JavaScript スキル

最初の方法:
HTML5 input タグの新機能 - プレースホルダーに基づいています。また、x-webkit-speech 属性により音声入力機能を実装できます。

コードをコピー コードは次のとおりです:

2 番目の方法 :
スパンを使用してシミュレートし、スパンを配置します、JS キーボード イベントを使用して入力を決定し、スパン内のコンテンツを表示するか非表示にするかを決定します。

コードをコピー コードは次のとおりです:

.org/1999/xhtml"> ;head>

;script type="text/javascript">
$(document).ready(function(){
$("#focus .input_txt ").each(function(){
var thisVal= $(this).val();
//テキスト ボックスの値が空かどうかを判断します。値が存在しない場合は、Display
if(thisVal! =""){
$(this).siblings("span").hide();
}else{
$(this).siblings("span ").show(); 🎜>}
//フォーカスされた入力ボックスの検証
$(this).focus(function(){
$(this).siblings("span").hide();
}) .blur(function(){
var val=$(this).val();
if(val!=""){
$(this) .siblings("span").hide ();
}else{
$(this).siblings("span").show();
}
})
$("# keydown .input_txt").each(function(){
var thisVal=$(this).val();
//テキスト ボックスの値が空かどうかを判断し、値がある場合は、値がない場合はプロンプトが表示されます。 }else{
$(this).siblings("span").show();
}
$(this).keyup(function(){
var val=$(this) .val( );
$(this).siblings("span").hide();
}).blur(function(){
var val=$(this).val() ;
if(val!=""){
$(this).siblings("span").hide();
}else{
$(this).siblings("span" ").show();
}
})
})
})