1

我对 jQuery 有点陌生。我在以下代码工作时遇到问题，特别是重置按钮：

<script>
$(function() 
{
    $(document).ready(function()
    {
        $("input[type=checkbox][checked]").each(
        function()
        {
            var cell = $(this).closest('td');
            if($(this).attr('checked'))
            {
                cell.toggleClass('check');
            }
        });
    });
    $('#bay :checkbox').click(function() 
    {
        var cell = $(this).closest('td');
        cell.toggleClass('check');
    }).change();
    $('#reset').click(function()
    {   
    $('#bay input[type=checkbox]').each(function()
    {
        var cell = $(this).closest('td');
        if ($(this).is('checked'))
        {
        //alert("yes");
            cell.addClass('check');

        }
        else
        {
            cell.removeClass('check');
        //alert("no");

        }
        });
    });
});
</script>

<input type="checkbox" checked>Blah

出于某种原因，当单击重置按钮时，脚本仅执行 cell.addClass if 语句。基本上，重置按钮起到恢复的作用，如果 HTML 代码中没有默认属性，则应该从 each 中删除添加的类 #check。

我尝试了一种低效的方法来检查带有选中属性的输入复选框，而没有一个在 FF 和 Chrome 中运行良好，但在 IE 中失败。只有按两次重置按钮才会起作用。

$('#reset').click(function()
{   

    $("input[type=checkbox][checked]").each(
    function()
    {
        var cell = $(this).closest('td');
        cell.addClass('check');
    });
    $("input[type=checkbox]:not([checked])").each(
    function()
    {
        var cell = $(this).closest('td');
        cell.removeClass('check');
    });
});

任何帮助将不胜感激！

编辑：根据请求，以下是带有工作（但无效）jQuery 代码http://jsfiddle.net/uxjCT/9/的 HTML 代码示例。

Edit2:*我稍微简化了代码的“重置”部分，但它仍然无法在 IE 中工作。任何人都知道这是否是一个无法解决的 IE 问题？本质上，对于在 HTML 中具有该属性的输入复选框以及样式表，我试图让重置功能重置为默认的 HTML“已检查”属性。IE是目前唯一痛苦的罪魁祸首。

$('#reset').click(function(){   

$('#bay input[type=checkbox]').each(function()
{
    var attr = $(this).is("[checked]");
    var cell = $(this).closest('td');

    if (typeof attr !== 'undefined' && attr !== false)
    {
        alert("checked");
        cell.addClass('check');
    }
    else
    {
        alert("unchecked");
        cell.removeClass('check');
    }
    });
});

由于某种原因，它var attr = $(this).is("[checked]");不会在 HTML 中选择“checked”属性，但如果复选框已被选中，则会选择，这可能与默认的 HTML 属性不同。

再次，任何帮助将不胜感激！

演示代码：http: //jsfiddle.net/uxjCT/55/

4

3 回答 3

2

检查复选框是否被选中的代码是

$(this).is(':checked')

不是

$(this).is('checked')

您的代码适用于此更改。

于 2011-05-03T06:10:10.473 回答
1

尝试这个... 

 $('#reset').click(function(){   

         cell.removeClass('check');//First remove class from all cell
        $('#bay :checked').each(function()
        {
                cell.addClass('check');//add class only to checked cells

        });
    });
于 2011-05-03T06:17:26.410 回答
1

这应该有效。稍微修改你的代码

$('#reset').click(function(){   
    $('#bay input:checkbox').each(function()
    {
        var cell = $(this).closest('td');

        if (this.checked)
        {
            //alert("yes");
            cell.addClass('check');
        }
        else
        {
            cell.removeClass('check');
            //alert("no");

        }
    });
});

您可以试用一个工作演示。

于 2011-05-03T05:59:51.090 回答