Добавление класса CSS ко всем <ввело type'text'> элементы? JavaScript / CSS?

Я хочу применить класс CSS к каждому текстовому полю в моем сайте:

        <div class="editor-label">
            <label for="FoodType">FoodType</label>
        </div>
        <div class="editor-field">
            <input id="HelpText" name="FoodType" type="text" value="" />
        </div>

        <p>
            <input type="submit" value="Create" />
        </p>

И я думал, Эй! Легкий. Я добавлю функцию jQuery для нахождения их всех в masterpage.

<script type="text/javascript">
    $(document).ready(function(){
        $('input').addClass('textbox');
    }
</script>

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

Alternativly является этим возможным использованием полностью CSS?

Если оба этих метода не возможны, я предполагаю, что должен буду просто вручную добавить класс к каждому текстовому полю, которое я делаю?

7
задан 4imble 20 September 2013 в 10:08
поделиться

1 ответ

AFAIK это:

$('input[type=text]').addClass('textbox');

И вы можете сделать подобное в файле CSS, но это требует более высокой версии CSS / в зависимости от того, насколько широко вы хотите работать со старыми браузерами.

Смотрите селекторы атрибутов в здесь. Обратите внимание, что:

"Поддержка браузеров: Единственный браузер, который не поддерживает селекторы атрибутов CSS3 - это IE6. IE7 и IE8, Opera и браузеры на базе Webkit и Gecko поддерживают. Так что использование их в таблице стилей определенно безопасно."

24
ответ дан 6 December 2019 в 07:50
поделиться