如果輸入的名字是價值

Question

這是我的設置：

HTML

1. How are you? 
<input class="calc" type="radio" name="1" value="2">Good 
<input class="calc" type="radio" name="1" value="1">Okey 
<input class="calc" type="radio" name="1" value="0">Bad 

的Javascript

if (name 1 has value 2) 
    { do something } 
else if (name 1 has value 1) 
    { do something } 
else if (name 1 has value 0) 
    { do something } 
else 
    { } 

我如何做一個，如果else語句後的名稱和價值？

Answer 1

var names = document.getElementsByName("1"); 

if (names[0].checked) 
    { do something } 
else if (names[1].checked) 
    { do something } 
else if (names[2].checked) 
    { do something } 
else 
    { } 

雖然它似乎簡單到只是抓住了一個檢查，並把它的值在switch()聲明。

var chkd = document.querySelector(".calc:checked"); 

switch(chkd.value) { 
    case 2: // ... 
      break; 
    case 1: // 
      break; 
    default: // ... 
} 

然而:checked需要一個現代瀏覽器，IE9一樣或更高。

Answer 2

後面的if聲明的一般前提是：

if ('statement to evaluate') { 
    // Code to execute if above statement is true 
} else if ('another statement') 
    // Code executes if first statement was false, but second one is true 
} else { 
    // If both above statements are false, execute this code 
} 

瞭解更多關於如果statments：https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Statements/if...else

更多關於什麼的值爲true：https://developer.mozilla.org/en-US/docs/Web/JavaScript/A_re-introduction_to_JavaScript

Answer 3

這裏有一個完整的例子。最好的部分是 - 你根本不需要條件。您可以使用該值本身來確定要使用的回調。這種方法被稱爲「財產查詢」。

Live demo (click).

樣品標記：

<form id="myForm"> 
    <h3>1. How are you?</h3> 
    <input name="1" type="radio" value="2"> 
    <label>Good</label> 

    <input name="1" type="radio" value="1"> 
    <label>Okay</label> 

    <input name="1" type="radio" value="0"> 
    <label>Bad</label> 

    <button disabled>Click me.</button> 
</form> 

的JavaScript：

var inputs = document.querySelectorAll('#myForm input'); 

var submit = document.querySelector('#myForm button'); 

for (var i=0; i<inputs.length; ++i) { 
    inputs[i].addEventListener('click', function() { 
    submit.removeAttribute('disabled'); 
    }); 
} 

var responses = [ 
    function() { //this is "responses[0] 
    console.log('this handles value 1!'); 
    }, 
    function() { //this is "responses[1] 
    console.log('this handles value 2!'); 
    }, 
    function() { //this is "responses[2] 
    console.log('this handles value 3!'); 
    } 
]; 

submit.addEventListener('click', function(e) { 
    var checked = document.querySelector("#myForm input:checked"); 
    var x = checked.value; 
    responses[x](); //call the response function for this value 
    e.preventDefault(); //prevent the form from submitting 
});