下面是問題的一個樣本快照你正在試圖解決:
- 4行文本域(此限制在文字區域本身=「4」行)
- 行1,2,和3被限制爲24個字符
- 4號線將具有字符的數量不受限制
快照textarea的的:
123456789
123456789
232323232323232323323232
23232323232323232323236464536543654643
的JavaScript:
$('#your-input').keypress(function() {
var text = $(this).val();
var arr = text.split("\n");
if(arr.length > 5) {
alert("You've exceeded the 4 line limit!");
event.preventDefault(); // prevent characters from appearing
} else {
for(var i = 0; i < arr.length; i++) {
if(arr[i].length > 24 && i < 3) {
alert("Length exceeded in line 1, 2, or 3!");
event.preventDefault(); // prevent characters from appearing
}
}
}
console.log(arr.length + " : " + JSON.stringify(arr));
});
這可以通過使用按鍵事件完成。當keypress事件觸發時,獲取文本框的當前值,並使用\n
換行符作爲分隔符將值拆分爲數組。
- 數組的長度告訴你有多少行。如果您超出了這些限制,我們會發出警報。
- 數組中每個單獨字符串的長度代表每行的長度。我們使用for循環來檢查前3行。如果我們超過24的長度,我們會發出警報。
- 我們忽略了循環的最後一次迭代,因爲我們不關心最後一行的長度。
這不是一個完整的解決方案,但是這一定會讓你開始併爲你提供一些你可以修改以滿足你的需求的東西。祝你好運!
如果你問是否有可能。但你有什麼嘗試? – Joseph
你試圖去做什麼?如果他們不必全部連接使用4個輸入,則可以根據需要限制它們。你甚至可能甚至假冒CSS看起來像一個4輸入,似乎是一個更好的解決方案 – Ryan
你可以通過換行符分割和檢測字符數。但問題在於,你無法控制每行所說的「行數」,這是由字體大小,字母間距等所決定的。某個OS上的一臺機器上的一行可能與另一臺機器上的另一行上的另一行不同。瑞恩的例子是一個更好的主意。 –