Question

我的邮件收件箱中的前2列html表存储复选框。第一列复选框显示在下面的代码中

<td width="5%"><input name="message" id="messages" type="checkbox" value="" class="<?php echo $status; ?>"/></td>

用户可以选择所有，非，已读，未读或已回复的消息。

<table width="55%" border="0">
  <tr><p id="links">
    <a href="#" id="all" class="pseudo">all</a>,
    <a href="#" id="none" class="pseudo">none</a>, <!-- word active removed from after pseudo-->
    <a href="#" id="read" class="pseudo">read</a>,    
    <a href="#" id="unread" class="pseudo">unread</a>,
    <a href="#" id="replied" class="pseudo">replied</a>,
    <a href="#" id="favourite" class="pseudo">favourite</a> <!-- This link is for favourites-->
</p>
    <td width="1%">Select</td>
    <td width="1%">Favourites</td>
    <td width="1%">Status</td>
    <td width="1%">From</td>
    <td width="30%">Subject/Message</td>
    <td width="17%">Date/Time</td>
  </tr>

第二个复选框显示在下面的代码中。

<td width="5%"><input name="" id="" type="checkbox" value="" <?php if ($row['favourite'] == 1) {echo 'checked="checked"';} else { echo ''; }?> class="favourite" messageid ="<?php echo $row['id']; ?>"/></td>

使用jquery替换为图像。当用户点击图像时，它将替换为彩色图像，这意味着用户已选择特定消息作为收藏夹。在数据库收藏列0 =不喜欢，1 =收藏。

以下是有助于在第一个复选框列中选择特定复选框的代码。

('#links').delegate('a', 'click', function(ev) {
    // reset all checkboxes
    $('tr>td:first-child>input:checkbox').attr('checked', false);

    // get info, what is the user choice
    whichMessages = $(this).attr('id');

    // do our main work - select checkboxes
    switch (whichMessages) {
    case 'all':
        $('tr>td:first-child>input:checkbox').attr('checked', true); //selects all from first checkbox column
        break;
    case 'read':
        $('tr>td:first-child>input:checkbox.read').attr('checked', true);
        break;
    case 'unread':
        $('tr>td:first-child>input:checkbox.unread').attr('checked', true);
        break;
    case 'replied':
        $('tr>td:first-child>input:checkbox.replied').attr('checked', true);
        break;

    };

    // add some user-frendly markup
    $('#links a').removeClass('active');
    $(this).addClass('active');

    // and standard action to prevent standard link click event
    ev.preventDefault();
});

收藏的复选框代码

// favourite check box
    $('input.favourite:checkbox').simpleImageCheck({
  image: '<?php echo base_url()?>images/messages/unchecked.png',
  imageChecked: '<?php echo base_url()?>images/messages/check.png',
  afterCheck: function(isChecked) {
     if (isChecked) {

 //query to db from php to update favourite number to 1
     $.post('<?php echo base_url()?>messages/favourite_checked/'+$(this).attr('messageid')); //post to messages controller, favourite_checked method and add message id to url

    }
    if (!isChecked)
        {
//query to db from php to update favourite number to 0
     $.post('<?php echo base_url()?>messages/favourite_unchecked/'+$(this).attr('messageid')); //post to messages controller, favourite_unchecked method and add message id to url
        }
  }
});

我想要做的是现在有一项功能，可以选择用户喜欢的所有消息。但我希望在第一列复选框中选择消息，就像所有其他选择选项一样。

我以后想要做的是让用户可以删除选择，移动选择等。

我将如何实现这一目标？

Answer 1

当用户将其作为收藏夹时，向行元素添加一个类，如下所示：

<tr class="favorite"> ... </tr>

此外，在输入元素中添加一个类，这是您的选择复选框，如下所示：

<td><input type="checkbox" class="selector" /> ... </td>

这样，稍后您可以通过按钮触发选择所有收藏夹，如下所示：

$("#favourite").click(function() {
    var $favorites = $(".favorite");
    $favorites.find(".selector").attr("checked", "");
});

要记住的一些事情：

input元素实际上并不需要checked属性的值，只是属性的存在足以表示“已检查”的想法。
如果您正在使用复杂的选择器，那么在函数顶部本地缓存结果并在以后重新使用它们会更有效。

Answer 2

您可以使用它们之间的空格添加多个类。 class =“check favorite red”

抱歉，暂不公开评论。

选择用户使用javascript / jquery检查的所有收件箱消息

2 个答案: