如何從標簽設置輸入字段最大長度

Question

我試圖找出一種方法，通過將值拉出字段標簽並更新默認值來更改稱為輸入字段的 ajax 的最大長度。 字段標簽都遵循相同的格式 - id、class、type 和 maxlength。 要設置的新 maxlength 值始終存在於 id ...max_X_characters...

`<input id="ecwid-productoption-16958710-Line_5_:0028max_4_characters:0029" class="gwt-
TextBox ecwid-productBrowser-details-optionTextField ecwid-productoption-
Line_5_:0028max_4_characters:0029" type="text" maxlength="200"></input>`

所以在這個例子中，我需要將 maxlength 設置為 4。

另一個問題是有多個輸入字段，通常具有不同的 maxlength 值。 有關示例，請參見此處。

我正在考慮設置一個腳本來在字段加載后提取值，但我不介意承認這一點，這超出了我的頭腦 - 希望你們中的一個聰明人能弄清楚！

更新：感謝您的建議，我已經嘗試了各種組合，但無法讓它們工作。

這是 Ecwid 的技術團隊建議的代碼，它將頁面上的所有輸入字段設置為一個最大長度（在這種情況下為 6）

 `Ecwid.OnPageLoaded.add(function(page){if (page.type == "PRODUCT") {  
 $("input.ecwid-productBrowser-details-optionTextField").attr('maxlength','6');
 };
 })`

但是，正如我所說，某些產品的輸入字段具有不同的最大長度。

根據您的建議，我嘗試將上面的“6”替換為一個函數，以從輸入 id 中獲取 maxlength，但無法使其正常工作。

還有更多想法嗎？

謝謝

更新：

破解它（幾乎），這是工作代碼

`Ecwid.OnPageLoaded.add(function(page){
 var regex = new RegExp("max_(\\d+)_characters");
 var inputs = document.getElementsByTagName("input");
 for (var i = 0; i < inputs.length; i++) {
 var inp = inputs[i];
 if (regex.test(inp.id)) {
    var newLimit = inp.id.match(regex)[1];
    inp.maxLength = newLimit;
 }        
 }
 });`

非常感謝您的幫助，它在產品頁面上就像做夢一樣，但還有另一個區域沒有。 客戶可以通過彈出窗口從購物籃中編輯輸入文本。

這些字段具有類似的代碼：

`<input id="ecwid-productoption-16958710-Line_5_:0028max_4_characters:0029"
class="gwt-TextBox ecwid-productBrowser-details-optionTextField ecwid-productoption-
Line_5_:0028max_4_characters:0029" type="text" maxlength="200"></input>`

非常歡迎建議

克里斯

更新：

非常非常感謝 ExpertSystem（你真是天才！） - 我想我們已經做到了。 （在 IE10、firefox 21、chrome 27 上測試）。

下面的代碼適用於同時使用 Yola 和 Ecwid 的人，但我想原始代碼可能適用於使用其他網站建設者的人。 它通過檢查輸入字段標題中的數字（在本例中為“max”和“characters”之間的值）並將其替換為字段的 maxLength 值來限制用戶可以在 Ecwid 中輸入到輸入字段的字符數. 它限制了產品瀏覽器、html 小部件和購物車彈出窗口中的字段。

這里是：

轉到 Yola 的自定義站點跟蹤代碼部分。 在“頁腳代碼”列（實際上位於“正文”底部）中，放置以下代碼：

<script>
Ecwid.OnPageLoaded.add(function(page){
var regex = new RegExp("max_(\\d+)_characters");
var inputs = document.getElementsByTagName("input");
for (var i = 0; i < inputs.length; i++) {
    var inp = inputs[i];
    if (regex.test(inp.id)) {
        var newLimit = inp.id.match(regex)[1];
        inp.maxLength = newLimit;
}        
}
});
</script>

<script>
var regex = new RegExp("max_(\\d+)_characters");
function fixMaxLength(container) {
    var inputs = container.getElementsByTagName("input");
    for (var i = 0; i < inputs.length; i++) {
        var inp = inputs[i];
        if (regex.test(inp.id)) {
            var newLimit = inp.id.match(regex)[1];
            inp.maxLength = newLimit;
        }
    }
};
</script>

並將其放入“標題代碼”列中：

<script>
document.addEventListener("DOMNodeInserted", function() {
    var popups = document.getElementsByClassName("popupContent");
    for (var i = 0; i < popups.length; i++) {
        fixMaxLength(popups[i]);
    }
});
</script>

而已！ 你很高興去。

Answer 1

id 屬性上的正則表達式怎么樣？ 例如以下內容：

jQuery('input').each(function() {
    var idVal = jQuery(this).attr('id');
    var regex = /max_(\d+)_characters/g;
    var result = regex.exec(idVal);
    var length = result[1];
});

這是對所有輸入的循環。 一旦運行，長度變量將具有適當的長度，用於下一步。

Answer 2

“ajax 調用的輸入字段”是什么意思並不完全清楚，但假設輸入字段是在某個 AJAX 調用的成功回調中創建並添加到 DOM 中的，您可以將以下代碼放在頁面中<head> :

var regex = new RegExp("max_(\\d+)_characters");
function fixMaxLength(container) {
    var inputs = container.getElementsByTagName("input");
    for (var i = 0; i < inputs.length; i++) {
        var inp = inputs[i];
        if (regex.test(inp.id)) {
            var newLimit = inp.id.match(regex)[1];
            inp.maxLength = newLimit;
        }
    }
}

然后，在 AJAX 調用的“onSuccess”回調結束時，附加以下內容：

fixMaxLength(document);

更新：
根據您在下面的評論，如果您需要將fixMaxLength()應用於動態添加到 DOM 的類“popupContent”的 div，一種簡單的方法（雖然不是最有效的）是為 DOM 修改事件添加偵聽器（例如在<head>某個地方）：

document.addEventListener("DOMNodeInserted", function() {
    var popups = document.getElementsByClassName("popupContent");
    for (var i = 0; i < popups.length; i++) {
        fixMaxLength(popups[i]);
    }
});

（注意：我只在最新版本的 Chrome 和 Firefox 上測試過它，所以我不確定這對哪些其他/舊瀏覽器有效。）
（注 2：GGGS，已經在 IE10 上對其進行了測試（並發現它可以工作）。）

如何從標簽設置輸入字段最大長度

問題描述

2 個解決方案

解決方案1
0 2013-05-15 19:28:23

解決方案2
0 已采納 2013-05-15 19:31:15

如何從標簽設置輸入字段最大長度

問題描述

2 個解決方案

解決方案1 0 2013-05-15 19:28:23

解決方案2 0 已采納 2013-05-15 19:31:15

解決方案1
0 2013-05-15 19:28:23

解決方案2
0 已采納 2013-05-15 19:31:15