插入DOM元素后如何使非事件javascript指令工作？

在插入DOM元素（即Ajax响应）之后，必须使用事件委派来使事件工作，但是基本的JS指令呢

正如您将看到的，所有指令都按照受影响的PHP页面进行排序（以便更容易地更新和改进代码，而不是多次重复相同的指令）。 在这里，我想测试给定的类是否存在。这个类在加载JS文件时不存在，但在插入AJAX响应后会存在

代码示例

// NAVBAR.PHP

if ( $('.className').length) {

$('.button-navbar').show(); }      

 /* FOOTER.PHP
 .... */

// VIEW_NEWS.PHP

$('.ajax_wrapper').on('click', '#view_news tr', function() {

    var id = $(this).attr("id");
    var get_news_request = $.ajax({type: "GET", url: "view_news.php", data: {news_id: id}, dataType: "html"});

    get_news_request.done(function(html) {

        $('.ajax_wrapper').hide('slide', {direction: 'right'}, function(){

            $('.ajax_wrapper').empty();
            $('.ajax_wrapper').hide().html(html);
            $('.ajax_wrapper').show('slide');

        });

    });

    get_news_request.fail(function(jqXHR, textStatus, errorThrown) {

        alert( "Request failed: " + textStatus + " " + errorThrown );
    });

});

不幸的是

if ( $('.className').length) {

$('.button-navbar').show(); } 

似乎没有执行，而类现在存在

---

你有没有一个不破坏JS文件体系结构的解决方案？

该代码不是事件处理程序，也没有设置任何类型的永久规则。这只是简单的程序代码，没有理由会自动再次调用它。在它被执行的时候，这个类上有一个。添加类不会使代码再次执行

但是，您可以在两个位置（在开始时和ajax回调中）手动执行该检查。为避免重复，您可以将共享功能放入实际功能中：

function show_navbar_check() {
    if ( $('.className').length)
        $('.button-navbar').show();
}

show_navbar_check();

然后在ajax回调中调用它：

$('.ajax_wrapper').on('click', '#view_news tr', function() {

    var id = $(this).attr("id");
    var get_news_request = $.ajax({type: "GET", url: "view_news.php", data: {news_id: id}, dataType: "html"});

    get_news_request.done(function(html) {

        $('.ajax_wrapper').hide('slide', {direction: 'right'}, function(){

            $('.ajax_wrapper').empty();
            $('.ajax_wrapper').hide().html(html);
            $('.ajax_wrapper').show('slide');

            /* I added the line below */
            show_navbar_check();
        });

    });

    get_news_request.fail(function(jqXHR, textStatus, errorThrown) {

        alert( "Request failed: " + textStatus + " " + errorThrown );
    });

});

---

旁注：使用也有一个解决此问题的方法，但我没有包括它，因为我认为上面的方法更好，部分是出于效率原因。

请打开“firefox”控制台测试此页面，在代码

if（$（'.className'）.length）{$（'.button navbar'）.show（）；}之前您会发现一些js错误

已执行。我没有看到任何错误，如果我在控制台中执行此指令（当然是在插入Ajax响应后），将显示导航栏按钮。感谢您提供此解决方案。我刚刚阅读了有关全局ajax事件

.ajaxComplete（handler）

，它可能更适合我的情况。@b1onic，请小心使用.ajaxComplete，它可能会导致意外行为，例如，当您在六个月后返回代码时，忘记了您拥有它，并添加了另一个ajax函数，花一个小时想弄清楚出了什么问题。对于像您的用例这样的东西，我真的怀疑ajaxComplete是否合适。感谢您的想法，我现在将继续使用您的解决方案。