[英]setting maxlength using javascript
我正在嘗試使用 JavaScript 動態設置輸入字段的最大長度。 顯然這是 IE 中的一個問題,我找到了部分解決方案。
$("input#title").get(0).setAttribute("max_length", 25);
$("input#title").get(0).setAttribute(
"onkeypress",
"return limitMe(event, this)");
function limitMe(evt, txt) {
if (evt.which && evt.which == 8) return true;
else return (txt.value.length < txt.getAttribute("max_length");
}
它適用於 Firefox,但由於某種原因不適用於 IE。 但是,它適用於這樣設置的輸入字段:
<input type="text" max_length="25" onkeypress="return limitMe(event, this);"/>
但由於輸入字段是動態創建的,我不能這樣做......有什么想法嗎?
如果您使用的是 jQuery 那么為什么不充分利用它的抽象呢?
例如
代替:
$("input#title").get(0).setAttribute("max_length", 25);
$("input#title").get(0).setAttribute(
"onkeypress",
"return limitMe(event, this)");
function limitMe(evt, txt) {
if (evt.which && evt.which == 8) return true;
else return (txt.value.length < txt.getAttribute("max_length");
}
做這個:
$('input#title').attr('maxLength','25').keypress(limitMe);
function limitMe(e) {
if (e.keyCode == 8) { return true; }
return this.value.length < $(this).attr("maxLength");
}
編輯:它在 IE 中不起作用的原因可能是因為您如何通過 setAttribute 附加“onKeyPress”處理程序。 - 這不是注冊事件處理程序的正確方法。
您正在尋找的屬性是maxlength
,而不是max_length
。 見這里。
IE 在 setAttribute() 上區分大小寫,並且只有“maxLength”有效...
var el=document.createElement('input'); el.setAttribute('maxLength',25);
不要忘記,如果您通過 JavaScript 設置最大長度,其他人也可以輕松地將最大長度更改為他們喜歡的任何值。 您仍然需要驗證服務器上提交的數據。
這里的所有答案都依賴於按鍵/粘貼事件。 這是我使用input
事件的解決方案:
$('input').on('input', onInput);
var inputValue = '';
function onInput(e) {
if(e.currentTarget.value.length > 30) {
e.currentTarget.value = titleValue;
return;
}
inputValue = e.currentTarget.value;
}
因為我對@James 的回答有一些麻煩,所以我寫了一些即使在復制粘貼內容時也有效的東西,尤其是在使用 IE8 及以下版本時。 我的實現使用 jQuery 及其現場活動。
jQuery(function () {
$('body').on('keydown.maxlength_fix', 'textarea[maxlength]', function (e) {
var $this = $(this);
window.setTimeout(function () {
var val = $this.val();
var maxlength = $this.attr('maxlength');
if (val.length > maxlength) {
$this.val(val.substr(0, maxlength));
}
}, 4);
});
});
我的代碼還打印出書面/最大字符,忽略那部分。
$("[maxlength]").bind("keyup focusin", function(){
var maxkey = $(this).attr("maxlength");
var length = $(this).val().length;
var value = $(this).val();
$(this).parent().find(".counter").text(length+"/"+maxkey);
if (length > maxkey) $(this).val(value.substring(0, maxkey));
}).bind("focusout", function(){$(this).parent().find(".counter").text("")});
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.