2016-01-01 2 views
0

Пожалуйста, помогите мне в этом вопросе Я хочу, чтобы заполнить все поля со случайными данными https://jsfiddle.net/omrmstg7/Получить данные во всех полях

<html> 
 
<head> 
 
<script> 
 
//<![CDATA[ 
 
window.onload=function(){ 
 
var button = document.getElementById("my-button"); 
 
var input = document.getElementById("my-input"); 
 

 
var names = ["Henry", "Joseph", "Mark", "Michael"]; 
 

 
button.addEventListener("click", function() { 
 
    input.value = names[Math.floor(Math.random() * names.length)]; 
 
}); 
 
}//]]> 
 
</script> 
 
</head> 
 
<body> 
 
<button id="my-button">Generate Random Names</button> 
 
<input type="text" id="my-input" /> 
 
<input type="text" id="my-input" /> 
 
<input type="text" id="my-input" /> 
 

 
</body> 
 
</html>

+2

'id' должен быть уникальным в том же документе. –

+0

getElementById возвращает только один элемент. Вы можете либо указать каждому вводу уникальный идентификатор, либо использовать querySelectorAll, чтобы найти все элементы ввода. – jeff

+0

Хотите получить данные во всех полях, но он дает только одно поле –

ответ

1

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

Проблема в том, что id зарезервирован для уникальных элементов.

Так что, если вы измените HTML для id быть class вместо этого, вы бы изменить JavaScript, чтобы что-то вроде этого:

var button = document.getElementById("my-button"); 
var inputs = document.getElementsByClassName("my-input"); 

var names = ["Henry", "Joseph", "Mark", "Michael"]; 

button.addEventListener("click", function() { 
    Array.prototype.forEach.call(inputs, function (input) { 
     input.value = names[Math.floor(Math.random() * names.length)]; 
    }); 
}); 
+0

не удалось. Сэр. изменено, но не отображается никаких данных. –

+0

Да, моя ошибка. Попробуйте сейчас, нужно работать. – lleaff

+0

Рабочие .. :) С благодарностью Сэр .. (уважение) –

0

Изменить входы использовать класс вместо Я бы.

Значения id должны быть уникальными в HTML, а getElementById возвращает только первый идентификатор соответствия.

Смежные вопросы