2016-01-25 3 views
-1

У меня возникли проблемы с JavaScript при попытке добавить текстовое поле в моей форме с «OnChange», это код:OnChange яваскрипт и добавление элементов

<!DOCTYPE html> 
<html> 
<body> 

<form id="formdemo"> 

</form> 

<p>Select a new car from the list.</p> 

<select id="mySelect" onchange="myFunction()"> 
    <option value="Volvo">33 
    <option value="1">1 
    <option value="Audi">Audi 
    <option value="BMW">BMW 
    <option value="Mercedes">Mercedes 
    <option value="Volvo">Volvo 
</select> 



<script> 
function myFunction() { 

    if (document.getElementById("mySelect").value == "1") { 
      document.getElementById("formdemo").innerHTML = " First name: <input type = "text" name ="firstname">" 
     } 
} 
</script> 

</body> 
</html> 

Как вы можете видеть, я хочу, чтобы генерировать текстовое поле, когда пользователь выбрал «1», но проблема в том, что когда я выбираю значение «1», текстовое поле не появляется.

Но когда я удалить «вход типа» код из JavaScript, код выглядит следующим образом:

<script> 
function myFunction() { 

    if (document.getElementById("mySelect").value == "1") { 
      document.getElementById("formdemo").innerHTML = " First name:" 
     } 
} 
</script> 

Он работает !!, это показывает «Имя:» на сайте. Этот метод, который я использую только для строк или просто для добавления абзацев, и я должен использовать другой метод для добавления форм, или я использую неправильный синтаксис?

Благодарим вас за это, у вас хороший день.

+1

'» Имя: <входной тип = "текст" имя = "Имя"> "' должен быть '" Имя: <входной тип = \ "текст \" name = \ "firstname \"> ";' –

+1

Вам нужно исправить свои синтаксические ошибки JS - если бы вы потрудились даже взглянуть на консоль отладки своего браузера, вы увидите, почему этот код никогда не будет работать как есть , –

+0

@ Lashane, спасибо, он работает, продолжайте движение. –

ответ

0

Ваш код в порядке, только в innterHTML у вас есть небольшая ошибка.

document.getElementById("formdemo").innerHTML = " First name: <input type = "text" name ="firstname">" 

и должен быть как

document.getElementById("formdemo").innerHTML = " First name: <input type='text' name='firstname'>" 
+0

Спасибо за ваши усилия –

0

Вы ошибаетесь в Струнный ввода:

<form id="formdemo"> 

</form> 

<p>Select a new car from the list.</p> 
<script> 
function myFunction() { 

    if (document.getElementById("mySelect").value == "1") { 
      document.getElementById("formdemo").innerHTML = 
      "First name: <input type=\"text\" name=\"firstname\">"; 
     } 
} 
</script> 
<select id="mySelect" onchange="myFunction()"> 
    <option value="Volvo">33</option> 
    <option value="1">1</option> 
    <option value="Audi">Audi</option> 
    <option value="BMW">BMW</option> 
    <option value="Mercedes">Mercedes</option> 
    <option value="Volvo">Volvo</option> 
</select> 

вход должен быть как "First name: <input type=\"text\" name=\"firstname\">";

здесь скрипку:>Fiddle

+0

Спасибо за ваши усилия –

0

Вы можете попробовать, как этот путь

var input = document.createElement("textarea"); 
div.appendChild(input); 
+0

Спасибо за ваши усилия –

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