入力コントロールの境界線の色(HTML / Javascriptを)リセット
-
05-09-2019 - |
質問
誰もがJavaScriptを使用して、それを修正した後、入力コントロールの境界線の色をリセットする方法を知っていますか?それらなどで不正または無効なデータを持つフィールドを強調表示し、検証するのに便利です。
例えば。国境を変えます:
document.getElementById('myinput').style.border = '1px solid red';
どのようにリセットするには?次の行がちょうど完全に境界線を削除します...
document.getElementById('myinput').style.border = '';
私は(例えば、黒やグレーなど)特定の色、それは「テーマ」コントロール...
の並べ替え一部のブラウザ/オペレーティング・システムでは奇妙に見えるかもしれに境界線の色バックリセットした場合おかげでヒープ!
解決
スタイル属性を設定することでそれをしないでください。 CSSクラスを使用して、それを実行してください。また、私はこれを処理するためのJavaScriptライブラリを使用することをお勧めします。それはちょうど、コードクリーナーを行います。
あなたは常に彼らが戻って設定されるべきかわからないので、CSS属性を削除すると問題があります。ただ...作品を追加し、クラスを削除します。
それをこのように(私見)をやっに対して引数が本当にありませんので、あなたは、要素ごとに複数のクラスを持つことができます。
私は私の例がそれにあるようにjQueryを使用しています。
間違った方法:
$("#myinput").css("border", "1px solid red");
正しい方法:
<style type="text/css">
.redborder { border: 1px solid red; }
</style>
<script type="text/javascript">
$("#myinput").addClass("redborder");
$("#myinput").removeClass("redborder");
$("#myinput").toggleClass("redborder");
</script>
他のヒント
これは私のために動作します:
document.getElementById('myinput').style.removeProperty('border');
あなたは単に国境が離れて行きたいですか?私はあなたがそうではありませんと述べてきたように、そうは思わない。
「リセット」する適切な方法は、デフォルトに設定することです。私は、デフォルトが何であるかわからないが、私は「1pxの黒」または類似のようなものを推測します。
私は、一般的に様々な用途で、この技術を使用しています。私はデフォルトを知らないとき、私は自分の「デフォルト」に設定されますので、私はそれを繰り返すことができます。私の好きな技術の一つは、Webページで、コントロールの背景色ではなく、境界線を設定することです。それは非常に表示され、あなたはより多くのミュート色を選択し、まだ影響を与える可能性があります。その場合には、デフォルトである、バック白に背景を設定することは非常に簡単です。