jQuery 切换输入复选框

在使用 jQuery 开发时，我们经常需要通过 JavaScript 修改页面元素的状态，比如切换输入复选框（checkbox）的选中状态。jQuery 提供了 .prop() 方法用于修改元素的属性，我们可以借助它来实现复选框的切换。

HTML

首先，我们需要在 HTML 中创建一个复选框，具体代码如下：

<input type="checkbox" id="checkbox">
<label for="checkbox">选中我试试</label>

这个复选框的 id 为 "checkbox"，我们会用它来获取复选框的 jQuery 对象。

JavaScript

要切换复选框的选中状态，我们需要通过 JavaScript 获取复选框的 jQuery 对象，然后调用 .prop() 方法来修改它的 checked 属性。具体代码如下：

$(function() {
  var checkbox = $('#checkbox');

  // 绑定点击事件
  checkbox.click(function() {
    // 切换选中状态
    $(this).prop('checked', !$(this).prop('checked'))
  });
});

这段代码会在页面加载完成后执行，它会获取 id 为 "checkbox" 的元素的 jQuery 对象，然后绑定一个点击事件。当用户点击复选框时，点击事件会触发，它会切换复选框的选中状态。具体来讲，它会先获取当前复选框的选中状态，然后取反并将结果赋值给复选框的 checked 属性，这样就可以实现复选框的切换了。

总结

通过上面的代码，我们可以实现简单的复选框选中状态的切换。当然，还有很多其他的操作都可以通过 jQuery 来完成，比如获取元素、修改样式、绑定事件等，这些功能都可以帮助我们更方便地操作页面元素，使开发更加便捷。