2013-06-24 2 views
-1

Я хотел бы добавить текст к ответу да/нет в пределах существующего ответа на кнопку радио, но я не уверен, как это сделать. Было бы вокруг линии 39 в этом jsFiddle http://jsfiddle.net/pjdicke/zudCf/2/Как я могу позвонить на радиокнопку?

<p>Yes <input type="radio" name="another" value="anotherYes" /></p> 
<p>No <input type="radio" name="another" value="anotherNo" /></p> 

Что мне нужно добавить, чтобы показать текст, основанный на да/нет ответа?

Линия 39 в разделе HTML содержит код, из которого я цитирую. Я хотел бы ответить на то, что да/нет, чтобы ответить на 2 ответа. Например: Является ли голубой (нет) = почему вы не думаете, что небо синее, вам не нравится синий цвет? (да) = что с тобой сделал синий? Но если ответ был = (нет) синий - это удивительный цвет

+2

Что именно вы подразумеваете под словом «добавить текст к ответу« да/нет »в пределах существующего ответа с помощью переключателя»? –

+2

В jsFiddle есть только 35 строк javascript, и, похоже, он делает именно то, что вы хотите. В чем проблема? –

+0

Строка 39 в разделе HTML - это код, из которого я цитировал код. Я хотел бы ответить на то, что да/нет, чтобы ответить на 2 ответа. Например: Является ли голубой (нет) = почему вы не думаете, что небо синее, вам не нравится синий цвет? (да) = что с тобой сделал синий? Но если ответ был = (нет) синий - это удивительный цвет – Richerdk

ответ

0

Я ненавижу анонимные функции. Хотя у них может быть место, это в основном просто ленивое программирование, imho.

Вот какой код, который, мы надеемся, будет более понятным для вас.

<!DOCTYPE html> 
<html> 
<head> 
<script> 
window.addEventListener('load', mInit, false); 

function mInit() 
{ 
    var radioBtns = document.querySelectorAll("input[type=radio]"); 
    var i, n = radioBtns.length; 
    for (i=0; i<n; i++) 
    { 
     var btnGroupName = radioBtns[i].getAttribute('name'); 

     if (btnGroupName == 'yesNo') 
      radioBtns[i].addEventListener('change', onRbGroup1Change, false); 

     else if (btnGroupName == 'gender') 
      radioBtns[i].addEventListener('change', onRbGroup2Change, false); 
    } 
} 
function onRbGroup1Change() 
{ 
    document.getElementById('radioResult').innerHTML = "Value of chosen radio button is: " + this.value; 
} 
function onRbGroup2Change() 
{ 
    document.getElementById('radioResult2').innerHTML = "Gender of chosen radio button is: " + this.value; 
} 

</script> 
<style> 
</style> 
</head> 
<body> 

<label>Yes<input type="radio" name="yesNo" value="afirmative"/></label> 
<label>No<input type="radio" name="yesNo" value="negative"/></label> 
<div id='radioResult'>You need to select a radio-button first!</div> 

<label>Girl<input type="radio" name="gender" value="Female"/></label> 
<label>Boy<input type="radio" name="gender" value="Male"/></label> 
<div id='radioResult2'>You need to select a radio-button first!</div> 

</body> 
</html>