Оценка переключателей в JavaScript

Question

Я новичок в JavaScript, и я пытаюсь использовать оператор if для оценки выбранного переключателя. Это не сработало, поэтому я спрашиваю, не потому ли, что я сделал что-то неправильно или потому, что это невозможно в JavaScript.

<form name = "f1"> 
    <input type = "radio" Name = "r1" Value = "Input" onClick="GetSelectedItem(this)">Input 
    <input type = "radio" Name = "r1" Value = "Output" onClick ="GetSelectedItem(this)">Output 

</form> 


<script> 
var output = document.getElementById('output'); 
function GetSelectedItem(el) { 
    output.innerHTML = el.value; 
    if(output=="Input") 
     *** do stuff *** /// 
    else if(output=="output") 
    ** do stuff2 *** 

} 
</script> 

Answer 1

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

output.innerHTML = el.value; 
if(output=="Input") 

В, если заявление, вы на самом деле проверка на выходе, что опорный элемент, не это текст или внутренний HTML. Оно должно быть:

if(output.innerHTML=="Input") 

или просто (если вы не используете выходной элемент для чего-нибудь еще, но проверка):

if(el.value=="Input") 

Смотрите этот пример:

function GetSelectedItem(el) { 
 
    if (el.value == "Input") { 
 
    alert('input clicked'); 
 
    } else if (el.value == "Output") { 
 
    alert('output clicked'); 
 
    } 
 
}

<form name="f1"> 
 
    <input type="radio" Name="r1" Value="Input" onClick="GetSelectedItem(this)">Input 
 
    <input type="radio" Name="r1" Value="Output" onClick="GetSelectedItem(this)">Output 
 

 
</form>

Answer 2

Вы можете использовать только el.value

var output = document.getElementById('output'); 

function GetSelectedItem(el) { 
    output.innerHTML = el.value; 

    if (el.value == "Input") { 
     alert(el.value); 
    } else if(el.value == "Output") { 
     alert(el.value); 
    } 
} 

Example

Answer 3

Не использовать == для Comparision, а использовать === как один проверяет только значения и другие проверки для значения и типа.

Я хотел бы написать функцию, как это:

<script> 
function GetSelectedItem(el) { 
    var output = document.getElementById('output'); 
    output.innerHTML = el.value; 
    if(el.value === "Input") 
    { 
     *** do stuff *** /// 
    } 
    else if(el.value === "output") 
    { 
    ** do stuff2 *** 
    }  
} 
</script>