当用户单击其他按钮时，如何取消选择整组单选按钮？

假设我有一个表格，人们可以选择他们想要什么样的宠物，并且可以选择指定品种和年龄，如下所示：

    <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 个问题，因此重新设置整个问题很麻烦。）

如果用户改变主意并切换到另一只宠物，我如何添加一个 JavaScript 来取消选择一只宠物的品种和年龄？

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

由于您所有的问题似乎都有独特的值，最简单的方法是将所有猫和狗的品种命名为相同的名称，例如“animalbreed”，并执行与“animalage”类似的操作。

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