Как получить значение входных элементов по имени класса в jquery - PullRequest
Новая
       1

Как получить значение входных элементов по имени класса в jquery

0 голосов
/ 18 февраля 2020

Я хочу получить входные значения элементов, у них есть класс «функции». Я могу получить доступ ко всем из них

alert ($ ('. Features'). Length);

Поправьте меня, если я ошибаюсь, $ ('. Features' ) является массивом html элементов ввода. Но я попытался

Array.isArray ($ ('. features')) // вернул false

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

function maintest() {

 for(i = 0 ; i < 5 ; i ++ ) {
  $("<input>").attr({"class":"features"}).appendTo("#mainDiv").val("input"+i);
  $("<br/><br/>").appendTo("#mainDiv");
 }
  
  $("<button> Click me! </button>").click(function() {
  let inputArray = [];
  inputArray = $('.features');
  alert(inputArray.length);
    //alert( inputArray[0].val());
    //what must be put here to see the data value
  }).appendTo("#mainDiv");
 }
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<body onload="maintest()">
  <div id="mainDiv"></div>
</body>

Ответы [ 2 ]

3 голосов
/ 18 февраля 2020

В javascript установка переменной в значение перезаписывает предыдущее значение. Тип не применяется, поэтому эти строки: 

let inputArray = [];
inputArray = $('.features');

совпадает с 

let inputArray = $('.features');

$() возвращает коллекцию jquery, а не массив javascript ; Конечно, есть сходства, но это не «массив».

Чтобы получить значения, вы можете l oop через коллекцию или вы можете использовать .map для извлечения значений, например: 

var valuesArray = $('.features').map(function() {
                      return $(this).val();
                  }).toArray();


function maintest() {

  for (i = 0; i < 5; i++) {
    $("<input>").attr({ "class": "features" })
        .appendTo("#mainDiv")
        .val("input" + i);
    $("<br/><br/>").appendTo("#mainDiv");
  }

  $("<button> Click me! </button>").click(function() {
    let inputArray = $('.features');
    var values = inputArray.map(function() {
      return $(this).val();
    }).toArray();
    console.log(values);
  }).appendTo("#mainDiv");
}

$(() => maintest());
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<div id="mainDiv"></div>
1 голос
/ 18 февраля 2020

Вы можете l oop по массиву ввода, используя метод jQuery $.each.

Пример: 

function maintest() {
  for (i = 0; i < 5; i++) {
$("<input>")
  .attr({ class: "features" })
  .appendTo("#mainDiv")
  .val("input" + i);
$("<br/><br/>").appendTo("#mainDiv");
  }

  $("<button> Click me! </button>")
.click(function() {
  let inputArray = [];
  inputArray = $(".features");
  $.each(inputArray, function(index, input) {
    console.log(input.value);
  });
})
.appendTo("#mainDiv");
}
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<body onload="maintest()">
  <div id="mainDiv"></div>
</body>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...