Передайте переменную в имя атрибута для входного текста

Omar Gonzales спросил: 13 октября 2017 в 06:56 в: javascript

У меня есть входной текст, который принимает несколько человек, и в соответствии с этим числом добавляет входные тексты для каждого. У меня есть цикл for, который позаботится об этом. Он также добавляет диапазон с правильным номером человека рядом с каждым входным текстом.

Но у меня возникают проблемы при использовании одной и той же переменной в атрибуте имени для каждого входного текста. Я получаю последнее число в каждом входном тексте (когда оно должно быть инкрементным).

Итак, входной текст с идентификатором p19_sub_1 меняет свое значение, функция добавляет общее количество введите текст в соответствии с этим значением.

Как программно установить правильный атрибут имени, например: p18_sub_1_X где "X" должно измениться с 1 на n (#p19_sub_1 value)?

$("#p19_sub_1").change(function() {

  $("#contenedor_de_personas").empty()

  var totalp = $("#p19_sub_1").val();
  var initial = 1;

  for (totalp; initial <= totalp; initial++) {
    // Runs 5 times, with values of step 0 through 4.

    console.log(initial);

    $("#contenedor_de_personas").append('<p><span>Persona ' + String(initial) + ':</span><input type="text" class="inp-text-personas" name="" value="" data-tipo="0"></p>')

  }

});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="contenedor_de_pregunta_19">

  <div class="row">
    <div class="col s12">
      <h5 class="orange-text">18. ¿CUÁLES SON LOS NOMBRES Y APELLIDOS DE CADA UNA DE LAS PERSONAS QUE DURMIERON AQUÍ, LA NOCHE ANTERIOR AL DÍA DEL CENSO? (NO OLVIDE REGISTRAR A LOS RECIÉN NACIDOS, ANCIANOS Y VISITAS).
      </h5>

      <h6>Registre a las personas en el orden que se indica a continuación:</h6>
      <ul>
        <li>Jefe o jefa del hogar</li>
        <li>Hijos/as, hijastros/as y/o hijos/as</li>
        <li>Esposa/o o compañera/o</li>
        <li>Adoptivos/as solteros/as con hijos/as</li>
        <li>Hijos/as, hijastros/as y/o hijos/as</li>
        <li>Hijos/as, hijastros/as y/o hijos/as adoptivos.</li>
        <li>Adoptivos/as solteros/as sin hijos/as</li>
        <li>casados/as o unidos/as y su familia</li>
        <li>Yerno / nuera</li>
        <li>Nieto/a</li>
        <li>Padres y/o suegros</li>
        <li>Otros/as parientes: tíos/as, hermanos/as, etc.</li>
        <li>Trabajador/a del hogar.</li>
        <li>Pensionista</li>
        <li>Otras personas no parientes del/de la jefe/a: amigos(as), compadres, etc.</li>
      </ul>

    </div>

  </div>

  <div class="row">

    <p>
      <span>Total personas:</span>
      <input type="text" name="tipo_vivi" id="p19_sub_1" value="total_personas" placeholder="#" data-tipo="0">
    </p>

    <div id="contenedor_de_personas">

    </div>

  </div>

  <div class="row">
    <div class="col s12 left-align">
      <button class="btn waves-effect waves-light btn-de-retroceso" data-posicion-de-pregunta="18">Retroceso<i
                    class="material-icons left">skip_previous</i></button>
    </div>
  </div>

  <div class="row">
    <button type="submit">enviar</button>
  </div>

</div>

Просмотреть в JSFiddle


0 ответов