Question

在我的index.php中，我使用jquery load函数加载页面内容。要访问刚加载的元素，我使用加载回调函数。

这是我的情景

的index.php

<html>..
<script type="text/javascript" src="js/jquery-2.1.1.min.js"></script>
<script type="text/javascript" src="js/script.js"></script>

<div id="load-page"></div>

<button type="button" class="btn btn-primary" id="reload">
    <span class="glyphicon glyphicon-refresh"></span> Reload
</button>
<button type="button" class="btn btn-default" id="selectAll">
    <span class="glyphicon glyphicon-check"></span> Select All
</button>
<button type="button" class="btn btn-default" id="add">
    <span class="glyphicon glyphicon-plus"></span> Add
</button>

加载-page.php文件

<input type="checkbox" name="chbox[]" value="1" />
<input type="checkbox" name="chbox[]" value="2" />
<input type="checkbox" name="chbox[]" value="3" />
<input type="checkbox" name="chbox[]" value="4" />

的script.js

$(function() {

    var loadPage = function () {

        $('#load-page').load('loaded-page.php', function() {

            $('#selectAll').on('click', function(){
                $('input[name="chbox[]"]').prop('checked', true);
                console.log($(this).html());
            });

            $('#reload').on('click', function(){
                loadPage();
            });

            $('#add').on('click', function(){
                $.ajax({
                    type: "POST",
                    url: add.php,
                    success: function(data) {
                        loadPage();
                    }
                });
            });

        });
    }

    loadPage(); // Load page when DOM ready

});

一切似乎都运转良好，但我注意到在启动时（首次加载），如果我点击＆＃34;全选＆＃34;按下控制台显示

<span class="glyphicon glyphicon-checked"></span> Select All

首次加载后如果我重新加载（重新加载或添加）然后我点击＆＃34;选择全部＆＃34;按下控制台显示

<span class="glyphicon glyphicon-unchecked"></span> Select All
<span class="glyphicon glyphicon-unchecked"></span> Select All

如果我仍然重新加载（重新加载或添加），然后我点击＆＃34;全选＆＃34;按下控制台显示

<span class="glyphicon glyphicon-unchecked"></span> Select All
<span class="glyphicon glyphicon-unchecked"></span> Select All
<span class="glyphicon glyphicon-unchecked"></span> Select All

依旧......

我该怎么办？谢谢

重新加载时Jquery加载函数行为

0 个答案: