在表单提交前检查字段收藏状态，最直接的办法是监听 submit 事件并在回调中读取 dom 元素的状态。通过 event.preventdefault() 阻止默认提交行为，可以确保只有当所有必填的收藏项都满足条件时，表单才会真正发送。如果某个关键字段未被收藏，则提示用户并中断流程。
如何获取单选按钮组的选中值
要判断收藏状态，首先需要从 HTML 表单中提取出代表“是否收藏”的控件值。通常使用 HTMLFormElement.elements 集合或 querySelector 来定位特定的 <input> 元素。对于单选按钮组（Radio Group），需要遍历同名的输入框，找到 checked 属性为 true 的那个，从而得到具体的收藏选项。
const form = document.getElementById('myForm');
const favoriteInputs = form.querySelectorAll('input[name="favorite_option"]');
let selectedValue = null;
favoriteInputs.forEach(input => {
if (input.checked) {
selectedValue = input.value;
}
});
console.log(selectedValue); // 输出选中的值，如 "yes" 或 "no"上述代码展示了如何遍历名为 favorite_option 的单选按钮组。如果用户选择了收藏，selectedValue 将包含对应的值；如果未选择任何项，则为 null。这种方法适用于标准的单选按钮布局，能够准确捕获用户的即时选择。
立即学习“Java免费学习笔记（深入）”；
如何在提交事件中集成验证逻辑
将获取到的收藏状态与业务逻辑结合，需要在表单的 submit 事件处理器中执行验证。如果收藏状态不符合要求（例如必须收藏才能提交），则调用 event.preventDefault() 取消提交，并可以通过 alert 或修改 DOM 来反馈错误信息。反之，如果状态合法，则允许表单继续其默认的提交动作。
form.addEventListener('submit', function(event) {
const isFavorite = Array.from(favoriteInputs).some(input => input.checked && input.value === 'yes');
if (!isFavorite) {
event.preventDefault();
alert('请先勾选收藏选项再提交！');
return;
}
// 验证通过，表单正常提交
console.log('表单已提交，收藏状态：是');
});在这个完整的示例中，addEventListener 绑定了 submit 事件。内部使用 Array.from 将 NodeList 转换为数组，以便使用 some 方法高效检查是否存在值为 'yes' 且被选中的项。如果不满足条件，立即阻止默认行为并给出提示。这种模式确保了前端验证的即时性和可靠性，避免了无效数据的提交。
基于特定收藏选项值的处理结果是什么
当用户明确选择了非收藏选项（如 value="no"）或未做选择时，程序会触发拦截机制。此时，isFavorite 变量计算结果为 false，导致 event.preventDefault() 生效。浏览器不会向服务器发送请求，页面上会弹出警告框告知用户操作失败。只有当用户更改选择为收藏状态后，再次点击提交按钮，验证才会通过，表单数据才会被正常发送。
