получить элементы массива HTML с помощью jquery

Question

у меня есть массив HTML;

<input class="input_box" name="authors[]" id="author1"/>

я хочу получить значение этого массива без обновления страницы (я отображаю значение рядом с полем ввода в независимом div)

$(document).ready(function(){    
$("input[id^="author"]").change(update);
});
    function update(){ 
    var authors=new Array();
    $("input[id^="author"]").each(function(){authors.push($(this).text()) }); 
    var author= '"' + authors.join('", "') + '"';

    $('#val-authors').html('authors:<span class="red"> "'+author+'"</span>');}

единственное, что я вижу в <div id="val-authors">, это "",

что мне не хватает?

спасибо заранее ..

Answer 1

Ваш селектор:

$("input[id^="author"]")

неверно, потому что вы пытаетесь использовать двойные кавычки внутри двойных кавычек. Одна из пар должна быть в одинарных кавычках.

Если вы использовали отладчик JS, это должно быть сразу видно.

FWIW, это более чистый способ получения необходимого массива:

var authors = $('input[id^="author"]').map(function() {
  return this.value;
}).get();

Answer 2

Ваш «HTML-массив» вообще не является массивом, даже если предположить, что есть ряд других подобных входных данных (хотя при отправке формы выбранный вами серверный язык, вероятно, позволяет вам получить доступ к значениям входных данных с тем же именем как массив). Во всяком случае ...

Основная проблема в том, что в вашем JS есть синтаксическая ошибка:

$("input[id^="author"]")

Если вы хотите включить двойные кавычки в строковый литерал, заключенный в двойные кавычки, вы должны их избежать:

$("input[id^=\"author\"]")

Или процитируйте строку с одиночками:

$('input[id^="author"]')

Может быть более эффективно избегать выбора атрибута, начинающегося с атрибута id, и выбирать атрибутом name, отмечая, что для jQuery квадратные скобки в имени атрибута необходимо экранировать с помощью обратной косой черты, а для строковых литералов JS также необходимо избегать обратной косой черты:

$('input[name="authors\\[\\]"]')

Также для получения значения ввода с помощью jQuery используйте .val() вместо .text(), но более эффективно просто использовать this.value:

var authors = [];
$('input[id^="author"]').each(function(){ authors.push(this.value); }); 

Я бы также рекомендовал объявлять массивы с = [] вместо = new Array().

Answer 3

Изменение:

$("input[id^="author"]").change(update);

К:

$("input[id^='author']").change(update);