javascript — JS: имя последнего элемента ввода (HTML / PHP)

Я лучше составлю список, чтобы объяснить шаги, которые я хотел бы сделать:

  1. Получить имя последнего элемента html-ввода (было сгенерировано через PHP)

Базовая настройка выглядит так:

<input type='text'name='E_8' value= '123' />
<input type='text'name='E_9' value= '456' />
<input type='text'name='E_10' value= '789' />
<input type='submit' name='submit' value='Update'/>
  1. Передайте это функции JS
  2. Добавьте некоторые дополнительные поля (используйте часть имени в качестве идентификатора для новых полей

JS-скрипт работает нормально, и я могу добавлять поля. Также содержимое полей обрабатывается PHP-скриптом и записывается в БД.

Коротко: как мне получить последнее значение, независимо от того, сколько там полей?

редактировать: я забыл, что есть кнопка отправки, которая будет отображаться как последний элемент … извините за это

0

Решение

Существует несколько подходов, но, учитывая, что все другие ответы основаны на библиотеке jQuery (которая добавляет ненужные накладные расходы), я сосредоточусь на демонстрации простых подходов JavaScript (работает в браузерах для последних версий выше IE8 +).

var allTextInputs = document.querySelectorAll('input[type="text"]'),
lastInput = allTextInputs[allTextInputs.length - 1],
lastInputName = lastInput.name;
var allInputsTxt = document.querySelectorAll('input[type="text"]');
var lastInput = allInputsTxt[allInputsTxt.length - 1];
var lastInputName = lastInput.name;
var lastInputValue = lastInput.value;
alert('last input name : ' + lastInputName + '; last input value : ' + lastInputValue);
<input type='text'name='E_8' value= '123' />
<input type='text'name='E_9' value= '456' />
<input type='text'name='E_10' value= '789' />
<input type='submit' name='submit' value='Update'/>
1

Другие решения

JQuery …

var lastInputName = $('input[type="text"]:last').attr('name');
1

Следующий код jQuery должен сделать свое дело.

var lastValue = $("input[type=text]:last").val();

Также с jQuery:

var $inputs = $("input[type=text]");
var lastValue = $inputs[$inputs.length - 1].value;
0

использование CSS3 селекторы в комбинации с шипение (jquery) нацелиться на последний элемент

var name = $('input[name^=E_]:last')[0].name
0

последнее значение в PHP или JavaScript?
в PHP поля обычно передаются в виде массива, поэтому вы можете получить последнее значение, используя

end($array)

Еще лучше, если вы назовете свое поле так

<input type='text'name='E[8]' value= '123' />
<input type='text'name='E[9]' value= '456' />
<input type='text'name='E[10]' value= '789' />

в JS вам нужно получить поля в массив и получить последний …. вам нужно что-то вроде этого

var myFields = document.forms["myform"].getElementsByTagName('input'),
var lastValue = myFields[(myFields.length-1)].value;
0

Оборачивая ваш код родительским элементом, скажем, с атрибутом id="inputs"Вот ванильное решение DOM (без jQuery):

// start by finding the last-most element
var lastInput = document.getElementById('inputs').lastElementChild;
// search backward to the last 'text' element
while (lastInput && lastInput.type !== 'text') {
lastInput = lastInput.previousElementSibling;
}
// and get its value
var lastValue = lastInput ? lastInput.value : null;

Интересной частью этого решения является создание без массива, поэтому вы сохраняете немного памяти JavaScript.
Это должно быть хорошо с Firefox, Chrome и IE 9.

0