Я могу поместить заполнитель через jQuery, если на странице есть один <input>:

<input type="text"/>

$(document).ready(function() {
    placeholders();
    function placeholders() {
        $('input[type=text]').each(function() {

            $(this).attr('placeholder', 'hello' );
        });
    }
});

Тем не менее, у меня есть несколько <input> полей на одной странице, как показано ниже:

<input type="text" class="first">
<input type="text" class="second">

Я хочу добавить заполнитель только в первый <input type="text"> с class="first".

Как добавить заполнитель только в первый соответствующий текст input?

7
pp1989 17 Дек 2015 в 10:24

5 ответов

Лучший ответ

Я хочу добавить заполнитель только для первого, который имеет class = "first".

Как добавить заполнитель только к первому соответствующему текстовому вводу?

Попробуйте использовать document.querySelector() с селектором "input[type=text][class=first]", setAttribute()

function placeholders() {
  document.querySelector("input[type=text][class=first]")
  .setAttribute("placeholder", "hello");
}

$(document).ready(placeholders);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js">
</script>
<input type="text" class="first">
<input type="text" class="second">
2
guest271314 17 Дек 2015 в 07:39

Если вам нужен скрипт для конкретного элемента, используйте ID вместо CLASS для лучшей производительности.

<input type="text" class="first" id="first">

$("#first").attr('placeholder', 'hello' );
0
Raja Sekar 17 Дек 2015 в 07:31
$('input[type=text].first').attr('placeholder', 'hello' );

Здесь input выберет все input tag, [type=text] выберет вход, тип которого является текстовым, а затем .first выберет подмножество с классом first.

Если вы хотите выбрать первый вход с помощью класса first, тогда выполните $('input[type=text].first').first()

3
void 17 Дек 2015 в 07:27

Вы можете попробовать это решение:
$('input[type=text].first').attr('placeholder', 'hello' );

1
Muhammad Atif 17 Дек 2015 в 07:29
$('input[type=text].first').attr('placeholder', 'hello' );

Используя селектор класса

1
gurvinder372 17 Дек 2015 в 07:27