HTMLDOM入力パスワードmaxLengthプロパティ
HTML DOM入力パスワードmaxlengthプロパティは、入力パスワードフィールドのmaxlength属性を設定または返すために使用されます。 maxLengthプロパティは、パスワードフィールドに入力できる最大文字数を指定します。
構文
以下は、-
の構文です。maxLengthプロパティの設定-
passwordObject.maxLength = integer
ここで、integerは、パスワードフィールドに入力できる最大文字数を指定します。
例
maxLengthフォームプロパティの例を見てみましょう-
<!DOCTYPE html>
<html>
<body>
<h1>Input Password maxLength Property</h1>
Password: <input type="password" id="PASS" maxLength="5">
<p>Increase the maximum number of characters to be entered for the above field by clicking below button</p>
<button onclick="changeMax()">CHANGE LENGTH</button>
<p id="Sample"></p>
<script>
function changeMax() {
document.getElementById("PASS").maxLength = "15";
document.getElementById("Sample").innerHTML = "Maximum number of characters are now increased to 15";
}
</script>
</body>
</html> 出力
これにより、次の出力が生成されます-
CHANGE LENGTHをクリックして、さらに文字を入力すると-
上記の例では
最初に、IDが「PASS」でmaxLength属性値が5に設定された入力パスワードフィールドを作成しました。これは、このフィールドに入力できるのは5文字のみであることを意味します。
Password: <input type="password" id="PASS" maxLength=”5”>
次に、ユーザーがクリックしたときにchangeMax（）メソッドを実行するボタンCHANGELENGTHを作成しました-
<button type="button" onclick="changeMax()">CHANGE LENGTH</button>
changeMax（）メソッドはgetElementById（）メソッドを使用して、パスワード型の入力フィールドを取得し、maxLengthプロパティを15に設定します。次に、innerHTMLプロパティ-<を使用して、IDが「Sample」の段落にメッセージを表示することでこの変更を示します。 / P>
function changeMax() {
document.getElementById("PASS").maxLength = "15";
document.getElementById("Sample").innerHTML = "Maximum number of characters are now increased to 15";
} -
HTMLDOM入力パスワードreadOnlyプロパティ
HTML DOM入力パスワードreadOnlyプロパティは、入力パスワードフィールドが読み取り専用かどうかを設定または返すために使用されます。 readOnlyプロパティを使用すると、要素は編集できなくなりますが、タブまたはクリックでフォーカスを合わせることができます。読み取り専用要素内にデフォルト値がある場合、送信時にサーバーに送信されます。 構文 以下は、-の構文です。 readOnlyプロパティを設定します- passwordObject.readOnly = true|false ここで、trueはパスワードフィールドが読み取り専用であることを表し、falseはそれ以外の場合を表
-
HTML DOMTextareamaxLengthプロパティ
HTML DOM Textarea maxLengthプロパティは、HTMLドキュメントのテキスト領域要素のmaxLength属性の値を返し、変更します。 構文 以下は構文です- 1。 maxLengthを返す object.maxLength 2。 maxLengthの変更 object.maxLength = “number” HTML DOM Textarea maxLengthプロパティの例を見てみましょう： 例 <!DOCTYPE html> <html> <style> body {