ホームページ ウェブフロントエンド jsチュートリアル input_javascriptスキルの初期値として値を書き込まない具体的な実装方法

input_javascriptスキルの初期値として値を書き込まない具体的な実装方法

May 16, 2016 pm 05:30 PM
input

1. <span> タグを記述し、入力上に配置し、クリックおよび入力にフォーカスすると消えるようにします。

例えば、inputの初期値を作るのに、以前はinputの値にそのまま書いていました。しかしある日、開発者は、これは機能しない、値の 7788% を渡すだろうと言いました... @残りは理解することしかできませんが、言葉で表現することはできません。そこで、初期値を別途書かないといけないので、バカなので<span>タグで書いてinput上に配置し、クリック時とinputにフォーカスすると消えるようにしています。

必ず覚えるべき単語。インターネットにはたくさんありますが、それを見ずにただ作って使用するなら、あなたは世界で最も愚かな人間になります。 !タイピングするときも手は震えていて、こんな小さなミスをした自分が本当に許せません。怠け者で愚かな人のために。思いつくところに正しい言葉を並べるだけです。

previousSibling は前のノードを検索します。

nextSibling は次のノードを見つけます。

html

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

<label class="password">
<span class="passText" onClick="CHECKON.hide(this,oldpwd)" id="oldPass">元のパスワード</span>
<input type="password" name="oldpwd" id="oldpwd" onfocus="CHECKON.showHelpInfo(this);" class="text" autocomplete="off" /> /label>

.password{ 位置:相対; }
.passText{ 位置:絶対; フォントサイズ:14px; }


js、長い長い長い長い単語に注目してください。 ! ! ! !またスペルを間違えると切り取られます。


var CHECKON={
showHelpInfo: function(idTa ){
var pve=(idTa.previousSibling.nodeType==1)?idTa.previousSibling:idTa.previousSibling.previousSibling
pve.style.display='none'
},
隠す :function(classN,id2){
var idBox=document.getElementById(id2);
classN.style.display='none';
idBox.focus();
}


2. 背景画像を使用して入力に背景画像を追加し、フォーカスがあるときに画像が消えるようにします。
3.html5 には、プレースホルダー属性という最新の属性があり、入力に自動的に表示され、灰色で表示されます。ただし、入力が入力された場合にのみ消えます。ただし、HTML5 は、IE8 ではサポートされていません。

上記には別の問題があります。つまり、ログイン ページを再度開くと、ブラウザは以前に入力した記録を記憶しており、アカウントとパスワードが自動的に表示されます。もちろんそれは良いことです。ただし、以前に設定したスパンタグの配置方法ではゴーストが発生します。

背景画像を使えば基本的には解決しますが、ie7では解決できません。

次のコードをヘッダーに追加して、以前にキャッシュされたログイン レコードをクリアします:



コードをコピー コードは次のとおりです。次のように: <meta http-equiv= "Pragma" content= "no-cache" />
<meta http-equiv= "Cache-Control" content= " no-cache" />
<meta http-equiv= "Expires" content= "0" />

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットな記事タグ

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Laravelの入力隠しフィールドを実装する方法 Laravelの入力隠しフィールドを実装する方法 Dec 12, 2022 am 10:07 AM

Laravelの入力隠しフィールドを実装する方法

vue3 で入力コンポーネントと統合フォームデータをカプセル化する方法 vue3 で入力コンポーネントと統合フォームデータをカプセル化する方法 May 12, 2023 pm 03:58 PM

vue3 で入力コンポーネントと統合フォームデータをカプセル化する方法

Vue ドキュメントの入力ボックス バインディング イベントの詳細な説明 Vue ドキュメントの入力ボックス バインディング イベントの詳細な説明 Jun 21, 2023 am 08:12 AM

Vue ドキュメントの入力ボックス バインディング イベントの詳細な説明

入力ボックスをクリックしたときにカーソルが表示されない場合の対処方法 入力ボックスをクリックしたときにカーソルが表示されない場合の対処方法 Nov 24, 2023 am 09:44 AM

入力ボックスをクリックしたときにカーソルが表示されない場合の対処方法

Vue ドキュメントで入力ボックスのキャリッジ リターン イベントと検証機能を使用する方法 Vue ドキュメントで入力ボックスのキャリッジ リターン イベントと検証機能を使用する方法 Jun 20, 2023 am 09:13 AM

Vue ドキュメントで入力ボックスのキャリッジ リターン イベントと検証機能を使用する方法

jqueryのinput要素とは何ですか? jqueryのinput要素とは何ですか? Jun 06, 2023 pm 02:18 PM

jqueryのinput要素とは何ですか?

html5入力で入力を禁止する方法 html5入力で入力を禁止する方法 Feb 03, 2023 am 10:02 AM

html5入力で入力を禁止する方法

Razer DeathAdder V3 HyperSpeed: 新しいマウスは高解像度と最大 8,000 Hz のワイヤレス ポーリング レートを提供します Razer DeathAdder V3 HyperSpeed: 新しいマウスは高解像度と最大 8,000 Hz のワイヤレス ポーリング レートを提供します Jun 22, 2024 am 12:20 AM

Razer DeathAdder V3 HyperSpeed: 新しいマウスは高解像度と最大 8,000 Hz のワイヤレス ポーリング レートを提供します

See all articles