Есть ли способ перебирать все поля в наборе полей?

Я хотел бы изменить класс для всех полей в определенном наборе полей.

Есть ли способ перебирать поля в наборе полей?

5 4
javascript html fieldset

5 ответов:

Вы можете использовать getElementsByTagName.

var fieldset= document.getElementById('something');
var fieldtags= ['input', 'textarea', 'select', 'button'];

for (var tagi= fieldtags.length; tagi-->0) {
    var fields= fieldset.getElementsByTagName(fieldtags[tagi]);
    for (var fieldi= fields.length; fieldi-->0;) {

        fields[fieldi].className= 'hello';
    }
}

(Если вы заботитесь только о полях input, Вы можете потерять внешний цикл тегов.)

Если они нужны вам в порядке следования документов (а не сгруппированы по тегам), вам придется пройти по элементам вручную, что будет болезненно и немного медленно. Вы можете использовать fieldset.querySelectorAll('input, textarea, select, button'), но не все браузеры поддерживают это. (В частности, IE6-7 предшествуют ему.)

6

Использование jQuery (ура!): 

$('#fieldset-id :input').each(function(index,element) {
    //element is the specific field:
    $(element).doSomething();
});
4

Обратите внимание, что решение ниже предназначено для реализаций, не связанных с JQUERY.

Реализуйте метод getElementsByClassName следующим образом:

После реализации кода ниже вы можете использовать документ.getElementsByClassName ("elementsInFieldSetClass") возвращает массив элементов с этим классом.

function initializeGetElementsByClassName ()
        {
            if (document.getElementsByClassName == undefined) {
                document.getElementsByClassName = function(className)
                {
                    var hasClassName = new RegExp("(?:^|\\s)" + className + "(?:$|\\s)");
                    var allElements = document.getElementsByTagName("*");
                    var results = [];

                    var element;
                    for (var i = 0; (element = allElements[i]) != null; i++) {
                        var elementClass = element.className;
                        if (elementClass && elementClass.indexOf(className) != -1 && hasClassName.test(elementClass))
                            results.push(element);
                    }
                    return results;
                }
            }
        }

window.onload = function () {
    initializeGetElementsByClassName();
};
1

Здесь другое решение jQuery.

Если вы просто добавляете класс(ы) к элементам, это просто: 

$('fieldset :input').addClass('newClass');

.addClass () (как и многие другие функции jQuery)будет работать со всеми элементами, которые соответствуют селектору.

Пример: http://jsfiddle.net/HANSG/8/

0

Навсегда? Найдите и замените в выбранном вами редакторе.

Когда пользователь нажимает на что-то? jQuery путь: 

$('fieldset <selector>').each(function() {
  $(this).removeClass('old').addClass('new');
});
-1