代码之家 › 专栏 › 技术社区 › Jason

为什么不设置attr(“选中”,“选中”)?

click checkbox jquery

Jason · 技术社区 · 14 年前

我有以下代码片段(我使用的是jquery 1.4.2):

$.post('/Ads/GetAdStatsRow/', { 'ad_id': id }, function(result) {
    $('#edit_ads_form tbody').prepend(result);
    $(result).find('td.select-ad input').attr('checked','checked').click();
});

假定post工作正常,并返回正确的预构建 <tr> 有一些 <td> 奇怪的是: $(result).find() 行查找正确的输入(这是一个复选框,因为它是单元格中唯一的输入)并运行链接的 click() 功能正常,但它拒绝将复选框设置为选中状态,我需要这样做。

这也是一个疯狂的转折…当我变得非常具体并改变 $(结果).find()) 行到此(复选框的ID):

$('#ad_' + id).click();

它会勾选方框,但不会运行 单击()。 功能!如果我把它设置为

$('#ad_' + id).attr('checked','checked').click();

它运行click函数,就像复选框一样,但该框保持未选中状态,如果我这样做的话

$('#ad_' + id).click().attr('checked','checked');

它什么也不做。

这到底是怎么回事?我的头发快没了……

谢谢!

编辑

以下是我在 $(function()) 呼叫:

$('td.select-ad input').live('click',AdPreview.selectAd);

它与所有其他复选框一样工作,如果用手单击,新添加的复选框确实工作。

编辑2

经过一些挖掘,我发现:

$('ad_'+id).click();

事实上做除了选中复选框外,还调用我的单击功能。但是,当调用click函数时(我已经检查了以确保 input 是正确的复选框,

var input = $(this);
console.log(input.is(':checked'));

即使实际选中了该框,日志仍返回false!GAH水处理厂

5 回复 | 直到 14 年前

nickf 14 年前

我想这是因为你在一些不在dom中的HTML上进行查找。

$.post('/Ads/GetAdStatsRow/', { 'ad_id': id }, function(result) {
    // the "result" html is copied into the DOM
    $('#edit_ads_form tbody').prepend(result);

    // now you're doing a find on some HTML which isn't in the DOM.
    $(result).find('td.select-ad input').attr('checked','checked').click();
});

这在一定程度上解释了为什么做特定的事情是有效的。以下是个别问题:

$('#ad_' + id).click();

这将单击该框(使其处于选中状态),但没有附加事件。

$('#ad_' + id).attr('checked','checked').click();

这会将属性设置为选中,然后单击它,直接取消选中它。

Brendan Kidwell 14 年前

http://www.electrictoolbox.com/check-uncheck-checkbox-jquery/

jquery(或浏览器的dom?我忘记了)对“checked”属性期望一个正确或错误的值,尽管在HTML源代码中它是“checked='checked'”。

小精灵。

Jonathan 14 年前

我怀疑这里发生的事情是 Click 实际上正在取消选中复选框。那是因为 Find 方法是,如您所说,返回复选框。

尝试删除点击呼叫。

这是一些示例代码

<html>
    <head>
        <script src="http://code.jquery.com/jquery-1.4.2.min.js"></script>
    </head>

    <body>

        <script type="text/javascript">
            function clicked() {
                console.log('clicked');
            }

            $(document).ready(function() {

                var result = '<tr><td><input type="checkbox" id="chkbx" onclick="clicked()" /></td></tr>';

                $('#edit_ads_form tbody').prepend(result);

                $('#edit_ads_form tbody').find("input").click();
            });
        </script>

        <table id="edit_ads_form">
        <tbody>

        </tbody>
        </table>
    </body>
</html>

Jason 14 年前

我明白了,谢谢所有让我走上正轨的人。我要做的是:

首先,而不是将我的复选框连接起来运行 click() ,我更新了它们以运行 change() . 在我这样做之后,我用下面的行来代替另一行:

$('#ad_' + id).click().change();

现在一切正常!复选框保持选中状态,并调用正确的函数。

再次感谢大家!

davidtbernal 14 年前

不是这样的 $(result).find('td.select-ad input').attr('checked','checked').click(); 去检查一下( .attr('checked','checked') )然后单击取消选中( .click() )?

如果我有什么东西不见了请原谅我,但我很确定就是这样。这就是为什么 $('#ad_' + id).click(); 行,但你的其他例子不行。