Question

代码非常简单，它可以更改博客上的文本，但是此博客具有分页功能，可通过ajax带来内容。

因此，代码正在更改加载时和ajax新内容上的文本。

$(document).ready(function() {
    $('.author').each(function(){
        $(this).text('Jim')
    });

    $(document).ajaxStop(function() {
        $('.author').each(function(){
            $(this).text('Jim')
        });
    });
});

我要问的问题是我可以编写更好的代码吗？这对我来说不合适，因为我两次执行相同的代码。

有更好的方法吗？

感谢帮助。

Answer 1

您可以将作者的更改放入一个函数中，并在需要时调用它。

<dialog (onSubmit)="save()">
  <!-- Dialog content here -->
</dialog>

Answer 2

使用某些功能包装代码

$(document).ready(function() {
  Jim()
    $(document).ajaxStop(function() {
        Jim()
    });
});

function Jim(){
      $('.author').each(function(){
        $(this).text('Jim')
    });
}

Answer 3

您可以编写一个单独的函数，因此代码仅执行两次。最好在Ajax调用的success方法中调用该函数，以便您可以控制错误，而不是将其设置为返回的值。

$(document).ready(function() {
    Author();
});

$.ajax({
    //params
    success: function() {
        Author();
    }
    error: function(response.responsetext) {
        console.log(response.responsetext);
    }
});

function Author() {
    $('.author').each(function(){
        $(this).text('Jim');
    });
}

Answer 4

将代码包装到函数中的另一种方法是使用相同的回调将多个事件侦听器附加到document，例如：

$( document ).on( 'ready ajaxStop', function() {
    $( '.author' ).each( function() {
        $( this ).text( 'Jim' );
    } );
} );

此代码应同时在ready和ajaxStop事件上运行。

修改

快速浏览文档，不再支持...

还有$(document).on( "ready", handler )，从jQuery 1.8开始不推荐使用，在jQuery 3.0中已删除。请注意，如果在附加此事件之前DOM准备就绪，则将不执行处理程序。

对此的“ hacky”修复方法是执行以下操作：

$( document ).on( 'ready ajaxStop', function() {
    $( '.author' ).each( function() {
        $( this ).text( 'Jim' );
    } );
} ).trigger( 'ready' );

工作示例：https://jsfiddle.net/j6dwu4zL/

如何编写代码以在加载和ajax调用上运行相同的功能

4 个答案: