切换Javascript

Question

创建密码生成器网站，我不知道如何允许人们切换复选框以选择密码的首选项。

我不知道如何让人们多次切换复选框。我还想知道当有人检查框时它是如何自动更新的。

<label class="input-toggle">

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

我一直在尝试这样的事情：

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

}）;

但我不知道如何让角色更长或更短作为选项。

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

Answer 1

非常简单的问题。

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属性的值，该属性是一个布尔值，表示是否单击了该复选框。

我可以做更多的事情来使我的偏好对象更加健壮。也许您希望使用新的HTML5 DOM存储来保留首选项，然后将此逻辑移动到也会在页面加载时触发的新全局。您还可以将此移动到一个通用函数，该函数处理许多不同的输入被更改以保持代码简洁，但我给出的将执行您所要求的。