jQuery 复选框撤消解决方案

标签 jquery jquery-ui jquery-selectors jquery-validate

<table> 
  <tr>
   <td>
    <div>
     <input type="checkbox" id="home1">Home1</input>
     <input type="checkbox" id="home2">Home3</input>
     <input type="checkbox" id="home3">Home3</input>
     <input type="checkbox" id="home4">Home4</input>
   </div>
  </td>
  <td id="selectedhome"> </td>
 </tr>
</table>

<input type="button" value="Select" />

在上面的代码中,单击按钮时,复选框的所有选定值都应显示在 selectedhome td 中,旁边有一个撤消链接,并且从第一个 td 中不可见。选择撤消按钮时,复选框应返回到初始位置。如何使用 jquery 实现此目的

最佳答案

尝试一下。它将把每个复选框重置为页面加载时的默认选中值。

示例: http://jsfiddle.net/6kFMk/1/

  // Display ID value of checked boxes
$('input[value=Select]').click(function() {
    var values = $('table :checkbox:checked').map(function() {
        return this.id;
    }).get().join(',');
    var home = $('#selectedhome').text(values);
});

  // Reset checkboxes to initial state
$('input[value=Undo]').click(function() {
    $('table :checkbox').each(function() {
        this.checked = this.defaultChecked;
    });
});​

关于jQuery 复选框撤消解决方案,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3746838/

相关文章:

jquery - 如何使用jquery避免输入文本框的重复值

javascript - 加载gif图片>执行语句>隐藏gif

jquery - 有没有一个好的 jQuery 插件可以实现隐藏效果,看起来就像 Windows 中最小化窗口一样

jQuery 选择器 $ ('table td:eq(2) a' ) 仅从第一行获取单元格

javascript - 在 JavaScript 或 jQuery 中动态更改 CSS 规则

javascript - Waypoints.js 无法按预期使用 Angular View

jquery - 如何在对话框中关闭 jQuery Dialog?

jQuery 淡入 CSS 类

jQuery "visible"不适用于所有浏览器,但在 Firefox 中

jquery - 当选择器是 JS 变量时如何使用 jQuery hasClass