Question

由于某些原因，我的变量保持重置为2，尽管我想在调用函数时增加变量。它真的很烦我，我已经多次重构代码无济于事！它应该很简单......

这是我的代码：

( function( $ ) {
        $( document ).ready( function () {
            var count = 2;
            var total = <?php echo $loop->max_num_pages; ?>;
            if ( count <= total ) {
                $( window ).scroll( function() {
                    if ( $( window ).scrollTop() == $( document ).height() - $( window ).height() ) {
                        $.ajax({
                            url: "<?php bloginfo( 'wpurl' ) ?>/wp-admin/admin-ajax.php",
                            type:'POST',
                            data: "action=infinite_scroll&page_no=" + count + '&loop_file=forums', 
                            success: function( html ){
                                $( "#content" ).append( html );
                            }
                        });
                        count++;
                    }
                });
            } else {
                return;
            }
        });
    })( jQuery );

编辑：感谢您的回复！更新了以下代码：

<script type="text/javascript">
    pageCount = 2;
    total = <?php echo $loop->max_num_pages; ?>;
    jQuery( window ).scroll( function() {
        if  ( jQuery( window ).scrollTop() == jQuery( document ).height() - jQuery( window ).height() ){
            console.log( 'Old value: ' + pageCount );
            if ( pageCount > total ){
                return false;
            } else {
                loadArticle( pageCount );
            }
            pageCount++;
            console.log( 'New value: ' + pageCount );
        }
    }); 

    function loadArticle( pageNumber ) {
        jQuery.ajax({
            url: "<?php bloginfo( 'wpurl' ) ?>/wp-admin/admin-ajax.php",
            type:'POST',
            data: "action=infinite_scroll&page_no=" + pageNumber + '&loop_file=forums', 
            success: function( html ){
                jQuery( "#content" ).append( html );
            }
        });
    return false;
    }
</script>

新值始终为3，旧值始终为2（在控制台中输出），因此它仍在重置...

已解决： ajax方法中的html回调导致了此问题。将增量移到那里工作了！新代码：

( function( $ ) {
        pageCount = 2;
        total = <?php echo $loop->max_num_pages; ?>;
        $( window ).scroll( function() {
            if  ( $( window ).scrollTop() == $( document ).height() - $( window ).height() ){
                if ( pageCount > total ){
                    return false;
                } else {
                    $.ajax({
                        url: "<?php bloginfo( 'wpurl' ) ?>/wp-admin/admin-ajax.php",
                        type:'POST',
                        data: "action=infinite_scroll&page_no=" + pageCount + '&loop_file=forums', 
                        success: function( html ){
                            $( "#content" ).append( html );
                            pageCount++;
                        }
                    });
                }
            }
        });
    })( jQuery );

Answer 1

首先要做的两件事：

var可以缩短为：

var var1 = 'string',
    var2 = 'int';

不要在JS里面混合php - 它很乱。创建一个隐藏的跨度并为其分配数据标签并像这样调用

其次，那是因为每次调用函数时值都会重置。放在外面，或传递一个名为count的参数，这样你就可以使它更通用，并在整个项目中使用它。

Answer 2

在函数外定义计数变量。

e.g。

var count = 2;
( function( $ ) {
        $( document ).ready( function () {
            var total = <?php echo $loop->max_num_pages; ?>;
            if ( count <= total ) {
                $( window ).scroll( function() {
                    if ( $( window ).scrollTop() == $( document ).height() - $( window ).height() ) {
                        $.ajax({
                            url: "<?php bloginfo( 'wpurl' ) ?>/wp-admin/admin-ajax.php",
                            type:'POST',
                            data: "action=infinite_scroll&page_no=" + count + '&loop_file=forums', 
                            success: function( html ){
                                $( "#content" ).append( html );
                            }
                        });
                        count++;
                    }
                });
            } else {
                return;
            }
        });
    })( jQuery );

Answer 3

这里的问题是var count是您方法的本地。这意味着它只在该方法调用中存活。下次再次调用函数时，它将创建一个值为2的不同count，因为这是您在声明中指定的值。将变量声明移到方法之外，一切都应该没问题。

变量在jQuery / JS中不递增？

3 个答案: