單選按鈕無法正常工作

Question

在我的網頁中，我放置了一些單選按鈕。 但這些按鈕無法正常工作。 我可以檢查多個按鈕。

代碼：

<label for="abc" style="margin-top:-20px;margin-left:40px">xyz</label>
<input type="radio" id="abc" name="abc" >        
<label for="bcd" style="margin-top:-20px;margin-left:40px">abc</label>
<input type="radio" id="bcd" name="bcd" >
<label for="efg" style="margin-top:-20px;margin-left:40px">ccc</label>
<input type="radio" id="efg" name="efg" >

Answer 1

因為你有不同的name屬性值，它們應該有一個共同的name值，就像你對項目進行分組一樣......例如

<input type="radio" name="group1" />
<input type="radio" name="group1" />
<input type="radio" name="group1" />

<!-- You can select any one from each group -->

<input type="radio" name="group2" />
<input type="radio" name="group2" />
<input type="radio" name="group2" />

演示

Answer 2

<label for="abc" style="margin-top:-20px;margin-left:40px">xyz</label>
<input type="radio" id="abc" name="abc" >        
<label for="bcd" style="margin-top:-20px;margin-left:40px">abc</label>
<input type="radio" id="bcd" name="abc" >
<label for="efg" style="margin-top:-20px;margin-left:40px">ccc</label>
<input type="radio" id="efg" name="abc" >

所有輸入必須具有相同的 name="" 屬性值

Answer 3

組合在一起的單選按鈕必須具有相同的區分大小寫的name屬性。

<label for="input1">First Input</label>
<input type="radio" id="input1" name="inputGroup" >
<label for="input2">Second Input</label>
<input type="radio" id="input2" name="inputGroup" >
<label for="input3">Third Input</label>
<input type="radio" id="input3" name="inputGroup" >

JSFiddle 演示。

從HTML 規范：

單選按鈕就像復選框，除了當幾個共享相同的控件name ，它們是互斥的。

Answer 4

Name 屬性需要相同。 名稱將單選按鈕組合在一起，使它們成為一個單元。

Answer 5

以相同的方式命名它們，在您的 php 或接收代碼中，它將類似於

$_POST['name'] = 'value of selected radio button'

Answer 6

name 設置告訴該字段屬於哪一組單選按鈕。 當您選擇一個按鈕時，同一組中的所有其他按鈕都將被取消選擇。 如果您無法定義當前按鈕屬於哪個組，則每個頁面上只能有一組單選按鈕。 例如：

<input type="radio" name="fruit1" value="Apple"> Apple <br>
<input type="radio" name="fruit1" value="Apricot" checked> Apricot <br>
<input type="radio" name="fruit1" value="Avocado"> Avocado
<hr>
<input type="radio" name="fruit2" value="Banana"> Banana<br>
<input type="radio" name="fruit2" value="Breadfruit"> Breadfruit<br>
<input type="radio" name="fruit2" value="Bilberry" checked>  Bilberry

Answer 7

為要從中選擇一個選項的所有單選按鈕指定相同的名稱

<label for="abc" style="margin-top:-20px;margin-left:40px">xyz</label>
<input type="radio" id="abc" name="abc" >        
<label for="bcd" style="margin-top:-20px;margin-left:40px">abc</label>
<input type="radio" id="bcd" name="abc" >
<label for="efg" style="margin-top:-20px;margin-left:40px">ccc</label>
<input type="radio" id="efg" name="abc" >

現在它將正常工作

Answer 8

賦予名稱相同的屬性。 Checked 屬性可用於指示應選擇哪個值。 在您要檢查的值的語法中的某處寫入已檢查=“已檢查”

Answer 9

我找到了這個線程，搜索關鍵字“html radio not working”。 查看我的代碼后，我注意到我使用了一個 javascript 方法“event.preventDefault();” 在我制作的這個自定義函數中，在該自定義函數中觸發此事件的 HTML 節點是“不工作”的無線電父節點。 所以我解決了刪除“event.preventDefault();”的問題。 如果將來有人到達這個線程，我希望這能以某種方式幫助你（即使是為了調試目的）。

"