2011-12-29 2 views
0

Я новичок в javascript. Вот мой кодОсновные события javascript

<script> 
function text_input_type(type) 
{ 
if(type=='list'){ 
document.getElementById("note_input").innerHTML="<input type=\"text\" name=\"body\">"; 
} 
else{ 
document.getElementById("note_input").innerHTML="<textarea id=\"note_input\" name=\"body\" cols=\"27\" rows=\"5\"></textarea>"; 
} 
} 

</script> 

<textarea id="note_input" name="body" cols="27" rows="5"></textarea> 
<input type="radio" name="type" value="text" onclick=text_input_type('list') /> 
<input type="radio" name="type" value="list" onclick=text_input_type('text') /> 

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

+0

В чем проблема, с которой вы сталкиваетесь? – AmGates

+0

Событие не должно срабатывать. Пропущенные котировки при назначении функции событию в DOM – Anand

+0

О, извините, я забыл часть. Я добавил. –

ответ

1

Надеется, что это поможет вам в решении вашей проблемы.

<script> 
    function text_input_type(type) 
    { 
    if(type=='list'){ 
    document.getElementById("note_input").innerHTML="<input type=\"text\" id=\"note_input1\" name=\"body\">"; 
    } 
    else{ 
    document.getElementById("note_input").innerHTML="<textarea id=\"note_input1\" name=\"body\" cols=\"27\" rows=\"5\"></textarea>"; 
    } 
    } 

    </script> 

    <div id="note_input"><textarea id="note_input1" name="body" cols="27" rows="5"></textarea></div> 
    <input type="radio" name="type" value="text" onclick=text_input_type('list') /> 
    <input type="radio" name="type" value="list" onclick=text_input_type('text') /> 

Пробуйте этот код, вы получите то, что хотите.

0

Ваш код верный, за исключением небольшого изменения.

<html> 
<body> 
<input type="radio" name="type" value="text" onclick="text_input_type('list');" /> 
<input type="radio" name="type" value="list" onclick="text_input_type('text');" /> 
<div id="note_input"> 
</body> 
</html> 

должны работать нормально

0

BIND обработчики кликов с Javascript слишком — рядный Javascript не является действительно необходимым:

var elems = [].slice.call(document.getElementsByTagName("input")); 
elems.forEach(function(elem){ 
    elem.onclick = function(){ 
     var type = this.value; 
     if(type === 'list'){ 
      alert("type is list"); 
     } else { 
      alert("type is not list"); 
     } 
    }; 
}); 

Example.

Я знаю, что это может быть немного сложнее. То, что мы просто делаем, - это привязка функции щелчка к каждому входному тегу на странице. Мы устанавливаем value переменной clicked tot he type и проверяем, равна ли эта переменная строке list. Если это так, тогда мы запускаем код в if. Если нет, мы запускаем код в else.

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

Однако, ваш код будет работать, если вы окружать onclick с кавычками, например, так:

onclick="text_input_type('list');" 
Смежные вопросы