ASP.NET的WebForms使用jQuery v1.9.0不起作用检查所有复选框在GridView [英] ASP.NET WebForms Checking all Checkboxes in a GridView using jQuery v1.9.0 doesn't work

问题描述

我有一个问题，我对jQuery的应用程序。我尝试了code例子（ http://aspnet.4guysfromrolla.com/articles/ 120810-1.aspx ）使用页眉复选框选中/取消选中所有行的GridView中。样品code工作与jQuery V1.4.4，但不与最新的jQuery版本v1.9.0工作。

I've a problem with my application regarding jQuery. I tried a code example ( http://aspnet.4guysfromrolla.com/articles/120810-1.aspx ) to use a Header CheckBox to check/uncheck all rows inside a GridView. The sample code works with jQuery v1.4.4 but doesn't work with the latest jQuery release v1.9.0.

这里的code。

<script type="text/javascript">
    var allCheckBoxSelector = '#<%=gvFileList.ClientID%> input[id*="chkAll"]:checkbox';
    var checkBoxSelector = '#<%=gvFileList.ClientID%> input[id*="chkSelected"]:checkbox';

    function ToggleCheckUncheckAllOptionAsNeeded() {
        var totalCheckboxes = $(checkBoxSelector),
            checkedCheckboxes = totalCheckboxes.filter(":checked"),
            noCheckboxesAreChecked = (checkedCheckboxes.length === 0),
            allCheckboxesAreChecked = (totalCheckboxes.length === checkedCheckboxes.length);

        $(allCheckBoxSelector).attr('checked', allCheckboxesAreChecked);
    }

    $(document).ready(function () {
        $(allCheckBoxSelector).live('click', function () {
            $(checkBoxSelector).attr('checked', $(this).is(':checked'));

            ToggleCheckUncheckAllOptionAsNeeded();
        });

        $(checkBoxSelector).live('click', ToggleCheckUncheckAllOptionAsNeeded);

        ToggleCheckUncheckAllOptionAsNeeded();
    });
</script>

使用jQuery V1.4.4一切都运行完美。使用jQuery v1.9.0每个页面加载我得到一个对象不支持此属性或方法：.live错误。如果我使用的语法：

With jQuery v1.4.4 everything works perfect. Using jQuery v1.9.0 every page load I get a "Object doesn't support this property or method: .live" error. If I use the syntax:

$(allCheckBoxSelector).click(function () {...

而不是上面的那个，我尽量避免错误，但页眉复选框仅一次。如果我点击它，没有什么appens。

instead of the one above, I avoid the error but the Header Checkbox works only once. If I click it again nothing appens.

我也试过了。对语法：

$(allCheckBoxSelector).on('click', function () {...

，但它不工作太

我想知道，如果这个问题是因为jQuery的v1.9.0的变化或错误。

I'd like to know if that issue is due to a change or a bug in jQuery v1.9.0.

推荐答案

jQuery的现场，现在应该通过更换。如果code的工作之前，应该只是工作，你通过现场后更改

jQuery live should now be replaced by on. If the code worked before it should just work after you change live by on.

我到了问题的根源：不得不使用 .prop 而不是 .attr 的。我做在$ C $一些小的修改也Ç

I got to the bottom of the problem: had to use .prop instead of .attr. I made some small modifications in the code too.

下面是上JS斌一个工作演示： http://jsbin.com/egopar/4/edit

Here's a working demo on JS Bin: http://jsbin.com/egopar/4/edit

这里的工作code jQuery的1.9：

Here's the working code for jQuery 1.9:

 $(document).ready(function () {

    var allCheckBoxSelector = $('#chkAll');

    var checkBoxSelector = $('input:checkbox:not(#chkAll)');

    function ToggleCheckUncheckAllOptionAsNeeded() {
        var totalCheckboxes = $(checkBoxSelector),
            checkedCheckboxes = totalCheckboxes.filter(":checked"),
            noCheckboxesAreChecked = (checkedCheckboxes.length === 0),
            allCheckboxesAreChecked = (totalCheckboxes.length === checkedCheckboxes.length);

        //console.log(allCheckboxesAreChecked);

        $(allCheckBoxSelector).prop('checked', allCheckboxesAreChecked);
    }

    $(allCheckBoxSelector).on('click', function () {
        $(checkBoxSelector).prop('checked', $(this).is(':checked'));

        ToggleCheckUncheckAllOptionAsNeeded();
    });

    $(checkBoxSelector).on('click', function () {
        ToggleCheckUncheckAllOptionAsNeeded();
    });
});

这篇关于ASP.NET的WebForms使用jQuery v1.9.0不起作用检查所有复选框在GridView的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！