用jq代码写城市选择可全选可单选

你好，以下是一个简单的用jq代码实现城市选择可全选可单选的示例：

HTML代码：

<div>
  <input type="checkbox" id="selectAll">全选
</div>
<div>
  <input type="checkbox" class="city">北京
</div>
<div>
  <input type="checkbox" class="city">上海
</div>
<div>
  <input type="checkbox" class="city">广州
</div>
<div>
  <input type="checkbox" class="city">深圳
</div>

JS代码：

$(document).ready(function() {
  // 全选
  $("#selectAll").click(function() {
    $(".city").prop("checked", $(this).prop("checked"));
  });
  // 单选
  $(".city").click(function() {
    if (!$(this).prop("checked")) {
      $("#selectAll").prop("checked", false);
    } else if ($(".city:checked").length == $(".city").length) {
      $("#selectAll").prop("checked", true);
    }
  });
});

以上代码中，首先定义了一个全选的复选框和若干个城市的复选框，并分别设置了它们的class属性。

然后在JS代码中，首先定义了全选的click事件，当全选复选框被点击时，将所有城市的复选框都选中或取消选中。

接着定义了城市复选框的click事件，当某个城市复选框被点击时，判断它是否被选中，如果取消选中，则取消全选复选框的选中状态；如果选中，则判断是否所有城市复选框都被选中，如果是，则选中全选复选框。