2014-01-16 47 views

回答

11

你可以做這樣的事情:

`

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()" /> 
` 
+0

這將長度限制爲最多5個字符,與所要求的大小完全不同。 (此外,它在代碼單元上工作,而不是字符,真的。) –

+0

@ JukkaK.Korpela我剛剛修改了我的答案以反映修改過的字符長度。以前,該問題指定了範圍從0到5個字符的限制。 – rboling

3

您需要使用輸入字段的最大長度屬性,這樣的事情應該這樣做:

<input name="myTextInput" type="text" maxlength="5"></input> 
+0

是的,我已經這樣做了。但是,我想要的是字符串不能少於5個字符,不能超過10個字符。對不起,我輸入0而不是10。 – cala

+0

你需要用javascript解決這個問題,@rboling有一個不錯的解決方案 – njfife

+0

沒關係。我第一次輸入0而不是10。儘管謝謝你的回答!欣賞它 – cala

2

你可以使用「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();  
}) 
+0

感謝這項工作的完美,儘管我不得不將它改爲JavaScript而不是jQuery。我所要做的就是將.value添加到var textbox = document.getElementById(「textbox」)。value;它的工作。感謝user3071372和@rboling – cala

2
<input name="myTextInput" type="text" minlength="5" maxlength="10"></input> 

這會做的伎倆,如果你不希望與JS的麻煩。

3

我對上述樣本進行了一些混合處理,試圖儘可能簡化並避免不必要的警報。 腳本:

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 = 「返回checkLength();」>

並在窗體本身的文本區域:

<label for="comment">*Comment:</label> 
<textarea name="comment" id="comment" rows="4" cols="40" required="required"></textarea> 

希望這幫助!

相關問題