Two radio buttons share one “id”?

问题:

I'm borrowing/adapting this simple html/javascript form set up to put some data in the database. The original code uses text fields in the form, but I'm using radio buttons. The first three steps below are the original, and my question comes after...namely, do I give the radio buttons the same id...Hope this is clear...

Step 1. User enters value into form with id "nick"

User          

Step 2. Value associated with id "nick" assigned to variable using id

var inputUser = $("#nick");   

Step 3. getting the value from the variable for insertion into database...

if(inputUser.attr("value") 

but if it's two "radio buttons" rather than one "text" field....

Interview   Pass  Fail 

Do I give the radio buttons the same "id" so that it's still like this when I assign the value to the variable...

var inputUser = $("#nick");  

so that whichever button is checked will be assigned found in the id "nick"?

回答1:

No, an Id attribute should always be unique. If you're using jQuery (looks like you are), you can select it with $('input[name=interview]');.

回答2:

Since you are using jQuery you can easily get the value of the selected radio button by using the :checked selector:

$("input[name=interview]:checked").val() 

You should definitely not give more than one element the same ID (that's invalid HTML and will lead to confusing bugs in your JavaScript), but even if that worked it wouldn't help in this case since radio buttons as a group don't have a selected value: you need to determine which one is currently checked and then get its value as shown above. (This is not a problem when getting the value on the webserver when the form is actually submitted, because only the value from the checked radio gets submitted.)

Note also that in your original code where you said inputUser.attr("value"), you could've said inputUser.val().

回答3:

ID Attribute is unique across the page. You should have different Ids for each radio button. Use below code to get the input value.

var inputUser=$('input:radio[name=interview]:checked').val(); 

回答4:

Do not repeat id's.It is best practice to use only one id per page as it must be unique.You can group the radio buttons using name attribute.

use $('input[name=interview]') to get the value.

回答5:

If want to use pure javascript you have to use..

document.querySelector('input[name=radio_btn_name]'); 

but it need updated browser. Old browsers may result incorrect.

To overcome this issue, javascript library is to use (library will handle the issue). For this use the following..

$('input[name=radio_btn_name]:checked').val(); 

回答6:

you must assign same name but different id to input type=radio because this is basic property of raido button that you need to select only one value from givel aal radio buttons.

but that id should not be assigned to other form elements

回答7:

The id assigned to an element must be unique within the document. So, no, you should not use the same id.

回答8:

Instead of id="nick"

You can use name="nick"

Or

class="nick" 

文章来源: Two radio buttons share one “id”?