当用户点击其他按钮时，如何取消选择整组单选按钮？ [英] How do I deselect a whole group of radio buttons when a user clicks on some other button?

问题描述

假设我有一个表格，人们可以选择他们想要的宠物类型，也可以选择这样的宠物类型：

Let's say I have a form where people can choose what kind of pet they want and - optionally - indicate a breed and age like this:

    <input type="radio" name="pet" value="P70" /> Cat<br> 
        Breed:<br> 
        <input type="radio" name="catbreed" value="P71" /> Persian  
        <input type="radio" name="catbreed" value="P72" /> Siamese
        <input type="radio" name="catbreed" value="P73" /> Tabby  <br> 
        Age:<br> 
        <input type="radio" name="catage" value="P74" /> Kitten
        <input type="radio" name="catage" value="P75" /> Adult
        <p>

    <input type="radio" name="pet" value="P78" /> Dog<br>
        Breed:<br>
        <input type="radio" name="dogbreed" value="P79" /> German Shepherd
        <input type="radio" name="dogbreed" value="P80" /> Golden Retriever
        <input type="radio" name="dogbreed" value="P81" /> Poodle  <br> 
        Age:<br> 
        <input type="radio" name="dogage" value="P82" /> Puppy
        <input type="radio" name="dogage" value="P83" /> Adult

如果他们先选择猫然后切换到狗，单选按钮将会关心这一点。但是，如果他们已经为猫选择了一个品种或年龄，那么无法取消选择。 （而且他们已经有70个问题，所以重置整个事情是一件麻烦事。）

If they first choose "cat" and then switch to "dog," the radio buttons will take care of that. But if they've already selected a breed or age for the cat, there's no way to deselect that. (And they're already 70 questions into the form, so resetting the whole thing is a hassle.)

如何添加一个可以取消选择品种和年龄的JavaScript对于一个宠物，如果用户改变主意并切换到不同的宠物？

How can I add a javascript that will deselect the breed and age for one pet if users change their minds and switch to a different pet?

更新：我可能不太清楚我的问题。我不想添加一个按钮来重置品种和年龄值，我只是希望它是自动和防白痴的。点击猫应该删除可能存在的任何值，可能会出现在dogbreed或dogage，并且点击dog应该删除任何存在catbreed或catage的值。

UPDATE: I probably wasn't clear enough in my question. I'm not looking to add a button to reset the breed and age values, I just want it to be automatic and idiot-proof. Clicking "cat" should erase any values that might be there for dogbreed or dogage, and clicking "dog" should erase any values that are there for catbreed or catage.

推荐答案

由于您的所有问题似乎都有独特的价值，最简单的方法是让所有的猫和狗的品种相同名称，如动物，并做一些类似的动物。

Since all your questions seem to have unique values, the easiest way would be to make all the cat and dog breeds the same name, like "animalbreed", and do something similar with "animalage".

这可能需要重新安排在后端，但它会以最简单的方式解决您的前端问题。

This might require some rearranging on the backend, but it would solve your frontend problem in the easiest way.

这篇关于当用户点击其他按钮时，如何取消选择整组单选按钮？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！