この記事では、参照用の特別なJSテキスト入力ボックスWebページの特殊効果を共有しています。特定のコンテンツは次のとおりです
例1：テキストボックスには下線しかありません
<script type = "text/javascript"> function changeTextStyle（）{//テキストボックスのみがアンダースコアのみを持っています//テキストボックスのdom var mytext = document.getElementById（ "myText"）; mytext.style.bordercolor = 'black'; //ボーダーカラーMyText.style.BorderStyle = 'Solid'を設定します。 //ボーダースタイルをソリッドラインに設定するmytext.style.borderwidth = '0 0 1px 0'; //ボーダーサイズを設定するには、0はno} </script>を意味します例2：最初の手紙またはすべての文字が大文字になります
<script type = "text/javascript"> //フォーマット検証function validateInput（）{//テキストボックスのdomを取得var mytext1 = document.getElementbyId（ "mytext1"）; var mytext2 = document.getElementById（ "myText2"）; var val1 = mytext1.value; //テキストボックスの値1 var val2 = mytext2.value; //テキストボックスの値2 var errmsg = ''; //エラープロンプト文字の定義アラート（errmsg）; } if（val2！= '' &&！// b [az]+/b/.test（val2））{//エラー文字errmsg = 'テキストボックス2の最初の文字を大文字にする必要がある/n';アラート（errmsg）; }} </script>例3：番号のみを入力できるテキストボックス
<script type = "text/javascript"> //フォーマット検証function validateinput（）{//テキストボックスのdomを取得var mytext = document.getElementById（ "myText"）; var val = mytext.value; //ユーザーが入力した値を取得しますif（！// b [0-9]+/b/.test（val））{//通常の検証アラートを使用します（ 'のみnumbers'）; //ヒントエラーメッセージ}} </script>例4：正規式で電子メール形式を確認します
<script type = "text/javascript"> //フォーマット検証function validateinput（）{//テキストボックスのdomを取得var mytext = document.getElementById（ "myText"）; var email = mytext.value; //ユーザーによる電子メール入力を取得する//正規表現を定義するvar emailegreg = /^( [a-za-z0-9__-]）+@( [a-za-z0-9__-]）+(/.2,3}）{1,2}））)$/; if（emailreg.test（email））{//フォーマット要件アラートを満たしているかどうかを判断します（「認定が渡され、提出が許可されます」）。 // pass} else {alert（ "failedをチェックして、再入力するようにチェックしてください"）; //検証に失敗しました}}} </script>例5：テキストボックスのコンテンツがフォーカスになったらクリア
<script type = "text/javascript"> // clear content function clearcontent（mytext）{mytext.value = ''; //テキストコンテンツの値をnull文字に設定} </script> <入力タイプ= "テキスト" value = "" onfocus = "clearcontent（this）"/>>例6：ユーザーがすぐにフォーマットチェックを入力した後
<script type = "text/javascript"> function validateTel（）{//形式検証//テキストボックスのDOMを取得var mytel = document.getElementById（ "mytel"）; var val = mytel.value; //ユーザーが入力した値を取得しますif（！// b [0-9]+/b/.test（val））{//通常の検証アラートを使用します（ 'のみnumbers'）; //プロンプトエラーメッセージ//スタイルを変更するには、注意を引くmytel.style.border = '1px solid red'; } else if（val.length！= 11）{//長さは11ビットアラートでなければなりません（ '携帯電話番号は11ビット'）; //エラーメッセージに答える//スタイルを変更して注意を引くmytel.style.border = '1px solid red'; } else {//スタイルを変更して、mytel.style.border = '1px solid green'であることを示します。 trueを返します。 }} </script> <入力型= "text" value = "" id = "mytel" onblur = "validatel（）"/>例7：テキストを入力するとテキストボックスの境界線が点滅します
onfocus（）とonblur（）をペアで書くのが最善です！
<script type = "text/javascript"> // function関数init（）{//すべてのテキストdom var texts = document.getelementsbytagname（ 'input'）; //（var i = 0; i <texts.length; i ++）{var t = texts [i]; //現在のテキストボックスvarタイマー; //スーパーバイザーフォーカスイベントT.onfocus = function（）{var e = this; //現在のdomの参照を保持しますcolor} else {//境界線は黄色になりますe.Style.borderColor = 'Yellow'; // 1秒ごとにフラッシュ}; T.onblur = function（）{//休暇イベントのために話す// border color t.style.bordercolor = ''; ClearInterval（タイマー）; //クリアタイマー}}}} </script> <body style = "text-align：center;" onload = "init（）;">上記はこの記事のすべての内容です。みんなの学習に役立つことを願っています。誰もがwulin.comをもっとサポートすることを願っています。