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

Question

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

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

Answer 1

Вы можете использовать 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 предшествует этому.)

Answer 2

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

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

Answer 3

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

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

После реализации приведенного ниже кода вы можете использовать document.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();
};

Answer 4

Еще одно решение jQuery здесь.

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

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

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

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

Answer 5

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

Когда пользователь что-то щелкает? JQuery способ:

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