Как установить поле ввода maxlength с метки

Question

Я пытаюсь выяснить способ изменения maxlength ajax, называемого полями ввода, потянув значение, заданное из метки поля, и обновив значение по умолчанию. Обозначения полей все соответствуют одному и тому же формату - id, class, type и maxlength. Новое значение MaxLength для установки всегда присутствует в ид ... 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. См., Например, here.

Я подумывал установить сценарий, чтобы вытащить значение после загрузки полей, но я не возражаю признать это, это над моей головой - надеюсь, один из вас, яркие парни, могут понять это!

Обновление: Спасибо за предложения, я пробовал оба в разных комбинациях, но не могу заставить их работать.

Вот код, предложенный технической команда Ecwid, которая устанавливает все поля ввода на странице с одной MAXLENGTH (6 в данном случае)

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

Однако, как я уже говорил есть поля ввода с различным maxlengths для некоторых продукты.

Я попытался заменить «6» выше функцией на основе ваших предложений, чтобы получить максимальную длину от входного идентификатора, но не может заставить ее работать.

Больше идей?

Благодаря

Update:

Трещины его (почти), вот рабочий код

`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>` 

Предложения очень приветственное

Chris

UPDATE:

Много, много, много благодаря ExpertSystem (вы гений ты!) - Думаю, у нас это есть. (тестируется на IE10, firefox 21, chrome 27).

Код, приведенный ниже для людей, использующих Yola и Ecwid вместе, но, я думаю, исходный код может работать для людей, использующих других сайтостроителей. Он ограничивает количество символов, которые пользователь может ввести в поля ввода, в Ecwid, проверив число в заголовке поля ввода (в этом случае значение между «max» и «character») и заменив его как значение maxLength поля , Он ограничивает поля в браузере продукта, виджетах html и всплывании корзины.

Здесь:

Перейти в раздел Пользовательского сайта кода отслеживания Йола в. В столбце 'FOOTER Code' (на самом деле расположен в нижней части 'тела'), поместите этот код:

<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

Не совсем понятно, что подразумевается под «ajax called input fields», но, предположив, что поля ввода создаются и добавляются в DOM внутри обратного вызова успеха для некоторого вызова AJAX, вы можете поместить следующий фрагмент кода в ваши страницы <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; 
     } 
    } 
} 

И затем, в конце "OnSuccess" обратного вызова на вызов Аякса, добавьте это:

fixMaxLength(document); 

UPDATE:
Основываясь на ваших комментариях ниже, если вам нужно применить fixMaxLength() к div's класса «popupContent», которые динамически добавляются в ваш DOM, простой способ (хотя и не самый эффективный) будет добавлять слушателя для событий модификации 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.)

Answer 2

Как насчет регулярного выражения атрибута 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]; 
}); 

Это петля по всем входам. Как только это будет выполнено, переменная длины будет иметь соответствующую длину для каждого следующего шага.