2016-01-24 2 views
0

Я пытаюсь автозаполнять текстовые поля с 1 по 3 с содержимым основного текстового поля, чтобы в текстовых полях также отображалось все, что напечатано в текстовом поле «Заголовок» Input1, Input2 и Input3. Вот что у меня есть, но я получаю сообщение об ошибке.Автозаполнение текстовых полей с содержимым основного текстового поля

<html> 
<head> 
<script type="text/javascript"> 
    function CopyData(val){ 
    var a = document.getElementById(val.id).value 
    document.getElementById("CopyText").value=Title 
    } 

    </script> 
</head> 
<body> 

Title:<input type="text" name ="Title" id="Text" onkeyup="CopyData(this)"/><br /> <br /> 
Input 1:<input type="text" name ="Input1" id="CopyText"/><br /> 
Input 2:<input type="text" name ="Input2" id="CopyText"/><br /> 
Input 3:<input type="text" name ="Input3" id="CopyText"/><br />                

</body> 
</html> 
+1

Пожалуйста, сообщите нам, какую ошибку вы получите. И: почему вы используете один и тот же идентификатор для нескольких элементов? –

+0

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

ответ

1

попробовать это:

<html> 
<head> 
<script type="text/javascript"> 
    function CopyData(val){ 
    var a = document.getElementById(val.id).value 
    var inputs = document.querySelectorAll(".input"); 
    for(var i=0;i < inputs.length;i++) 
    { 
     inputs[i].value = a; 
    } 

    } 

    </script> 
</head> 
<body> 

Title:<input type="text" name ="Title" id="Text" onkeyup="CopyData(this)"/><br /> <br /> 
Input 1:<input type="text" class="input" name ="Input1" /><br /> 
Input 2:<input type="text" class="input" name ="Input2" /><br /> 
Input 3:<input type="text" class="input" name ="Input3" /><br />                

</body> 
</html> 

замечания:

  1. не используют тот же идентификатор для нескольких элементов. попробуйте класс вместо
  2. вы используете «Заголовок», который не определен, используйте «a», где вы сохранили значение ввода
  3. , чтобы получить сразу несколько элементов с помощью простых js, хорошим методом является использование «querySelectorAll», с соответствующим селектором.

удачи.

0

Я думаю, вы не можете назначить один и тот же идентификатор метки для более чем одного TextBox, так что вы должны в конечном итоге с более «жестко закодированы» JavaScript функции. Кроме того, я хотел бы использовать Title.value и не только Название

function CopyData(){ 
document.getElementById("CopyText1").value=Title.value; 
document.getElementById("CopyText2").value=Title.value; 
document.getElementById("CopyText3").value=Title.value; 
} 
Смежные вопросы