HTML
 Computer >> コンピューター >  >> プログラミング >> HTML

HTMLDOM入力パスワード必須プロパティ

HTML DOM入力パスワードrequiredプロパティは、要素のrequired属性に関連付けられています。必須プロパティは、フォームがサーバーに送信される前にパスワードフィールドに入力する必要があるかどうかを設定し、返すために使用されます。これにより、ユーザーが必須属性のパスワードフィールドを空のままにした場合、フォームを送信できなくなります。

構文

以下は、-

の構文です。

必要なプロパティの設定-

textObject.required = true|false

ここで、trueはテキストフィールドに入力する必要があることを表し、falseはフォームを送信する前にフィールドに入力するオプションを表します。

例

入力パスワード必須プロパティの例を見てみましょう-

<!DOCTYPE html>
<html>
<body>
<h1>Input password required property</h1>
<p>Check if the above field is mandatory to be filled or not by clicking the below button</p>
<form action="/Sample_page.php">
Password: <input type="password" id="PASS1" name=”passW” required>
<input type="submit">
</form>
<br>
<button onclick="checkReq()">CHECK</button>
<p id="Sample"></p>
<script>
   function checkReq() {
      var Req=document.getElementById("PASS1").required;
      if(Req==true)
         document.getElementById("Sample").innerHTML="The password field must be filled before submitting";
      else
         document.getElementById("Sample").innerHTML="The password field is optional and can be left blank by the user";
   }
</script>
</body>
</html>

出力

これにより、次の出力が生成されます-

HTMLDOM入力パスワード必須プロパティ

チェックボタンをクリックすると-

HTMLDOM入力パスワード必須プロパティ

必要なプロパティがtrueに設定されていて、[送信]-

をクリックした場合

HTMLDOM入力パスワード必須プロパティ

上記の例では-

最初に、IDが「PASS1」、名前が「passW」、必須属性がtrueに設定された入力パスワードフィールドを作成しました。パスワードフィールドは、フォームデータの送信先を指定するaction =” Sample_page.php”のフォーム内に含まれています。送信ボタンをクリックしました。

<form action="/Sample_page.php">
Password: <input type="password" id="PASS1" name=”passW” required>
<input type="submit">
</form>
>

次に、ユーザーがクリックしたときにcheckReq（）メソッドを実行するボタンCHECKを作成しました-

<button onclick="checkReq()">CHECK</button>

checkReq（）は、getElementById（）メソッドを使用して、パスワード型の入力要素を取得し、必要なプロパティを取得します。この場合、trueを返します。返されたブール値は変数Reqに割り当てられ、戻り値がtrueかfalseかに基づいて、innerHTMLプロパティ-

を使用して、IDが「Sample」の段落に適切なメッセージを表示します。 
function checkReq() {
   var Req=document.getElementById("PASS1").required;
   if(Req==true)
      document.getElementById("Sample").innerHTML="The password field must be filled before submitting";
   else
      document.getElementById("Sample").innerHTML="The password field is optional and can be left blank by theuser";
}

  1. HTMLDOM入力パスワードタイププロパティ

    HTML DOM入力パスワードtypeプロパティは、type =” password”を持つinput要素に関連付けられています。入力されたパスワード要素のパスワードを常に返します。 構文 パスワードタイププロパティの構文は次のとおりです- passwordObject.type 例 入力パスワードタイププロパティの例を見てみましょう- <!DOCTYPE html> <html> <body> <h1>password type property</h1> PASSWORD: <input type="passw

  2. HTMLDOM入力パスワードのサイズプロパティ

    HTML DOM入力パスワードサイズプロパティは、入力パスワードサイズ属性値を設定または返すために使用されます。これは、パスワードフィールドの幅を文字で定義するために使用されます。デフォルトの幅は20文字です。 構文 以下は、-の構文です。 パスワードサイズプロパティの設定- passwordObject.size = number ここで、数字はパスワードフィールドの幅を文字で表します。デフォルトの幅は20文字です。 例 Inputpasswordsizeプロパティの例を見てみましょう- <!DOCTYPE html> <html> <body>