0

Как передать текст из нескольких input вместе с placeholder? Чтобы было: Цвет: ...., Фасон: ...., Сейчас передается всегда только placeholder из первого input

var fields = $('#quiz-forms').find('.quiz-form');
  fields.on('change keyup', function(){
    var tags = [];
    fields.each(function(){
      if ($(this).val().length)
      {
        tags.push($(this).val());
      }
    });
    $('#SendInput', '#quiz-forms').val($('.quiz-form').attr('placeholder')+tags.join(', '));
  });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form id="quiz-forms">
<input type="text"  class="form-control quiz-form"  placeholder="Цвет: "/><br/>
<input type="text"  class="form-control quiz-form"  placeholder="Фасон: "/><br/>

<input type="" name="SendInput" id="SendInput" value="" />
</form>

3
  • Вот тут $('.quiz-form').attr('placeholder') вы получаете плейсхолдер только из первого инпута с данным классом.
    – Quazimorda
    9 авг 2021 в 12:07
  • @Quazimorda ну я знаю, об этом и написала, вопрос в том, как получать placeholder для каждого input свой, а не только первый 9 авг 2021 в 12:09
  • Самое простое, в цикле где вы собираете массив tags, собрать не только значения, но и плейсхолдеры каждого элемента. Хотя они статичны и наверное можно выводить их по индексу.
    – Quazimorda
    9 авг 2021 в 12:23

1 ответ 1

2

Самый простой способ, как по мне, написать так:

    let fields = $('#quiz-forms').find('.quiz-form');
    fields.on('change keyup', function(){
        let tags = [];
        fields.each(function(){
            if ($(this).val().length)
            {
                tags.push($(this).attr('placeholder') + ' ' + $(this).val());
            }
        });
        $('#SendInput', '#quiz-forms').val(tags.join(', '));
    });
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <form id="quiz-forms">
        <input type="text" class="form-control quiz-form" placeholder="Цвет: " /><br />
        <input type="text" class="form-control quiz-form" placeholder="Фасон: " /><br />

        <input type="" name="SendInput" id="SendInput" value="" />
    </form>

То есть вы сразу в результирующий массив сохраняете плейсхолдеры и значения, если текущий input у вас не пустой.

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.