テキストがあり、ユーザーが5〜10文字のテキストのみを入力できるようにする場合、javasciptを使用してこれを行うにはどうすればよいですか。
mix
およびmax
関数を使用してみましたが、数値データに対してのみ機能します。
次のようなことができます:
`
function checkLength(){
var textbox = document.getElementById("textbox");
if(textbox.value.length <= 10 && textbox.value.length >= 5){
alert("success");
}
else{
alert("make sure the input is between 5-10 characters long")
}
}
</script>
<input type="text" id="textbox"></input>
<input type="submit" name="textboxSubmit" onclick="checkLength()" />
`
入力フィールドにmaxlength属性を使用する必要があります。次のようにする必要があります。
<input name="myTextInput" type="text" maxlength="5"></input>
上記のサンプルを少し組み合わせて、できるだけシンプルにし、不必要なアラートを回避しようとしました。脚本:
function checkLength(){
var textbox = document.getElementById("comment");
if(textbox.value.length <= 500 && textbox.value.length >= 5){
return true;
}
else{
alert("Your comment is too short, please write more.");
return false;
}
}
フォームフィールドのコードは次のようになります。onsubmit= "return checkLength();">
そして、フォーム自体のテキスト領域:
<label for="comment">*Comment:</label>
<textarea name="comment" id="comment" rows="4" cols="40" required="required"></textarea>
お役に立てれば!
「maxlength」属性を使用して、x文字を超えないようにし、javascriptを使用して最小長の検証を行うことができます。
この例を参照してください: http://jsfiddle.net/nZ37J/
HTML
<form id="form_elem" action="/sdas" method="post">
<input type="text" id="example" maxlength="10"></input>
<span id="error_msg" style="color:red"></span>
<input type="button" id="validate" value="validate"></input>
</form>
Javascript:
$("#validate").click(function(){
var inputStr = $("#example").val();
if(inputStr.length<5)
$("#error_msg").html("enter atleast 5 chars in the input box");
else
$("#form_elem").submit();
})
<input name="myTextInput" type="text" minlength="5" maxlength="10"></input>
これは、jsでトラブルを起こしたくない場合に役立ちます。