Question

我正在网上使用这个widget，使复选框看起来像iOS开关。我试图根据我在其他地方拥有的变量来启动关闭开关。问题是，如果我使用checkbox.click()，则将更改窗口小部件的基础复选框，但不会触发该开关。我正在尝试使用此特定事件来了解有关JS不了解的内容的更多信息，尤其是如何触发小部件动画。该小部件的js非常令人困惑，我认为我可以通过click()或onclick()来触发动画，但都无法正常工作。我不知道如何进行。

下面是一个最小的工作示例。只需将存储库下载到名为simple_switch_master的文件夹中，然后将这些文件添加到同一目录中即可！

html文件，index.html：

<html>
<head>
    // Load in libraries
    <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/2.0.0/jquery.min.js">    </script>
    <script src="./simple-switch-master/jquery.simpleswitch.js"></script>
    <link rel="stylesheet" href="./simple-switch-master/simple-switch.css" />
</head>

<body>
    <div><input id=toggle  type="checkbox" class="mybox"></div>

    <script src="./control.js"></script>
    <script>
        $(".mybox").simpleSwitch();
    </script>
</body>
</html>

JavaScript文件control.js：

var checkbox = document.getElementById("toggle");
console.log(checkbox.checked) // Returns false as expected
checkbox.click()
console.log(checkbox.checked) // Returns true even though the switch is off

Answer 1

在某些版本的jQuery中，如果您使用checkbox.checked将返回此元素的初始状态（如果以该值开头，则有时为true），而不会更改。但是，某些版本可以修改此值。

如果要更改状态，可以使用$("#elementID").prop("checked")

您可以在http://api.jquery.com/prop/

看到这些详细信息和属性之间的差异。

如何触发自定义复选框小部件

1 个答案: