Toggle Javascript

Toggle Javascript

本文关键字：Javascript Toggle      更新时间：2023-09-26

制作一个密码生成器网站，我不知道如何允许人们切换复选框来选择他们的密码偏好。

我不知道如何允许人们多次切换复选框。我也想知道当有人选中复选框时，它是如何自动更新的。

<label class="input-toggle">
       <input type="checkbox" id="checkbox1" checked>
        <span></span>
          </label>

我一直在尝试这样的东西：

$('#checkbox1').click(function() {

})；

但我不知道如何让字符变长或变短。

到目前为止我所拥有的：http://codepen.io/HaydnAnderson/pen/EKGxJP

非常简单的问题。

https://jsfiddle.net/41vuxh44/1/

window.passwordGen = {
    preferences : {
    uppercase : false,
    numbers   : false
  }
};
$("#numbers").on('change', function(event)
{
    window.passwordGen.preferences.numbers = $(this).prop('checked');
  console.log(passwordGen);
});

在我的示例中，我将一个活动更改事件绑定到#numbers复选框。使用on是执行活动事件绑定的新方法。

当复选框被更改时，它会触发事件。然后，我将全局首选项对象更新为checked属性的值，这是一个布尔值，表示是否单击了复选框。

我可以做更多的事情来让我的偏好对象更加健壮。也许您想使用新的HTML5DOM存储来保留偏好，然后将此逻辑移动到一个新的全局，该全局也会在页面加载时触发。您也可以将其移动到一个通用函数中，该函数处理许多不同的输入，以保持代码简洁，但我所提供的内容将满足您的要求。

相关文章：