Question

在onLoad页面上我有一个滑出的div框，当鼠标悬停或悬停时它会滑动 - 在哪个工作正常。

现在我正在尝试添加新功能，如果选中了一个复选框，则不会滑出或禁用滑出。如果不检查，则自动滑出以便启用。

你可以看到id =“checkbox”......为什么不起作用！

HTML

<div class="sidebar-nav-right">                            
<ul class="nav nav-list accordion-group latest-group-sidebar">
<input name="" type="checkbox" id="mycheckbox" value="">                           
</ul>
</div>

... jquery的

$(window).on("load", function() {    $(".sidebar-nav-right").animate({ "right": "-=150px" }, "fast" ); });

$(".sidebar-nav-right").hover(function () {
    $(".sidebar-nav-right").animate({ "right": "0px" }, "fast" ); }, function(){
     $(".sidebar-nav-right").animate({ "right": "-=150px" }, "fast" ); });

$("#mycheckbox").on('change', function () {
    $(".sidebar-nav-right").toggleClass("sidebar-nav-right"); });

Answer 1

您使用的是toggleClass错误。 toggleClass意味着只需切换一个类。

http://api.jquery.com/toggleclass/

但你只使用一个班级。最简单的方法是使用CSS动画为关闭状态和打开状态编写CSS。然后使用toggleClass在单击时添加和删除该类。

如何在复选框中滑出

1 个答案: