问

我在 html 的 form 中有一些复选框，我希望当我选择其中一个的时候，其它的都自动被取消选择。那么我该使用什么方式来实现呢？

<span data-type="comment-insert-smilie" class="muted comt-smilie" id="enginebox">
            <input type="radio"  name="dogedoge" value="no">
            <label for="dogedoge">多吉</label>
            <input type="radio"  name="baidu" value="no">
            <label for="baidu">百度</label>
            <input type="radio"  name="sougou" value="no">
            <label for="sougou">搜狗</label>
            <input type="radio"  name="google" value="no">
            <label for="google">谷歌</label>
            <input type="radio"  name="haosou" value="no">
            <label for="haosou">好搜</label>
        </span>

ChatGPT 说：

如果你希望在复选框组中仅允许一个选项被选中，那么应使用单选按钮（radio button）来代替复选框。单选按钮本身就是为此目的设计的，即在一组选项中只能选择一个。

根据你的代码示例，你已经在使用 ，但是你将 name 属性设置成了不同的值。如果希望所有单选按钮属于同一组，并且在用户选择其中一个时自动取消其他选项的选择，需要确保所有按钮的 name 属性相同。

例如，修改代码如下：

<span data-type="comment-insert-smilie" class="muted comt-smilie" id="enginebox">
    <input type="radio" name="searchEngine" value="dogedoge" id="dogedoge">
    <label for="dogedoge">多吉</label>

    <input type="radio" name="searchEngine" value="baidu" id="baidu">
    <label for="baidu">百度</label>

    <input type="radio" name="searchEngine" value="sougou" id="sougou">
    <label for="sougou">搜狗</label>

    <input type="radio" name="searchEngine" value="google" id="google">
    <label for="google">谷歌</label>

    <input type="radio" name="searchEngine" value="haosou" id="haosou">
    <label for="haosou">好搜</label>
</span>

在此示例中，所有按钮的 name 属性都为 searchEngine。这样，当用户选择其中一个选项时，其他选项会自动取消选择。

您说：

怎样让第一个选项在页面打开后就自动被选择呢

ChatGPT 说：

要让页面加载时默认选择第一个选项，可以在第一个 标签中添加 checked 属性。

例如：

<span data-type="comment-insert-smilie" class="muted comt-smilie" id="enginebox">
    <input type="radio" name="searchEngine" value="dogedoge" id="dogedoge" checked>
    <label for="dogedoge">多吉</label>

    <input type="radio" name="searchEngine" value="baidu" id="baidu">
    <label for="baidu">百度</label>

    <input type="radio" name="searchEngine" value="sougou" id="sougou">
    <label for="sougou">搜狗</label>

    <input type="radio" name="searchEngine" value="google" id="google">
    <label for="google">谷歌</label>

    <input type="radio" name="searchEngine" value="haosou" id="haosou">
    <label for="haosou">好搜</label>
</span>

添加 checked 后，页面加载时第一个选项（多吉）会自动被选中。