jQuery事件练习

廖雪峰JavaScript教程--jQuery事件练习：

对如下的Form表单：

绑定合适的事件处理函数，实现以下逻辑：
当用户勾上“全选”时，自动选中所有语言，并把“全选”变成“全不选”；
当用户去掉“全不选”时，自动不选中所有语言；
当用户点击“反选”时，自动把所有语言状态反转（选中的变为未选，未选的变为选中）；
当用户把所有语言都手动勾上时，“全选”被自动勾上，并变为“全不选”；
当用户手动去掉选中至少一种语言时，“全不选”自动被去掉选中，并变为“全选”。

请选择想要学习的编程语言：

全选全不选 反选

JavaScript

Python

Ruby

Haskell

Scheme

Submit

---- 一网友评论实现的： ```



运行

请选择想要学习的编程语言：

全选全不选 反选

JavaScript

Python

Ruby

Haskell

Scheme

Submit

``` 自己写的，不是很好： ``` // TODO:绑定事件 selectAll.change(function(){ if (selectAll.prop('checked')){ form.find(':checkbox').prop('checked', true) deselectAllLabel.show(); selectAllLabel.hide(); } else{ form.find(':checkbox').prop('checked', false) deselectAllLabel.hide(); selectAllLabel.show(); } }); invertSelect.click(function(){ var checked = langs.filter(':checked') var unchecked = langs.not(":checked") checked.prop('checked', false); unchecked.prop('checked', true); langs.change(); }) langs.change(function(){ if (langs.filter(':checked').length === 5){ selectAll.prop('checked', true); selectAll.change(); } if (langs.filter(':checked').length === 0){ selectAll.prop('checked', false); selectAll.change(); } if (langs.filter(':checked').length < 5){ selectAll.prop('checked', false); deselectAllLabel.hide(); selectAllLabel.show(); } }) ```