javascript - 只选择一个复选框

标签 javascript html checkbox

我想构建一个 javascript,以便用户只能在下面提到的选项中选择一个选项。你能给我一些指导,因为我是一个 javascript 菜鸟。

谢谢!

这是菜单部分的图片 enter image description here

<td><label for="dock_books_search_visible_online"> Visible online?</label></td>
                        <td><input type="checkbox" name="option" value="checkedVisibleOk" id="dock_books_visible_ok"  /> </td>
                        <td><label for="dock_books_search_visible_online_yes"> Yes</label></td>
                        <td><input type="checkbox" name="option" value="checkedVisibleNok" id="dock_books_visible_nok" /> </td>
                        <td><label for="dock_books_search_visible_online_no"> No</label></td>

最佳答案

对于从多个选项中进行的单选,我们使用 Radio Buttons 而不是 CheckBoxes

你应该使用这样的东西。

<input type="radio" name="option" value="Yes" id="yes" /> 
<input type="radio" name="option" value="No" id="no" /> 

但是如果你想反过来,只需在你的head标签中添加以下脚本:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
    $(':checkbox').bind('change', function() {
        var thisClass = $(this).attr('class');
        if ($(this).attr('checked')) {
            $(':checkbox.' + thisClass + ":not(#" + this.id + ")").removeAttr('checked');
        }
        else {
            $(this).attr('checked', 'checked');
        }
    });
});
</script>

这是 fiddle以上。

希望这对您有所帮助。

关于javascript - 只选择一个复选框,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/8518372/

相关文章:

php - 如何自动更新网页的URI?

javascript - 将多个 id 从复选框传递到 Laravel 中的 Controller

javascript - 可以在不使用 "for=id"的情况下将标签与复选框相关联吗?

javascript - 如何更改放置在 iframe 中的 div 的更改宽度

javascript - 在检查器窗口和 JavaScript 中看到的 img 标签尺寸之间的区别

html - 如何在 Spring Boot 应用程序中使用 Thymeleaf 加载 HashMap 和 ModelandView 对象值?

javascript - Google Map API V3 无法在 polymer 元素内部工作

php - 高级自定义字段复选框

javascript - Angular Scope 在 onclick 函数中不起作用

javascript - 递归指令不起作用