使所有JavaScript都能正常處理Ajax內容

Question

我正在處理一個普通的引導主題，其中包含js滑塊，彈出窗口，文本旋轉，砌體盒子等。

主題包含所有相關的js庫和main.js

所有這些都將通過ajax在用戶指定的操作上加載新內容。

這是用於文本旋轉的js / ajax：在下面的示例中，我必須調用“ $（'。text-rotation'）。owlCarousel”，以使文本旋轉正常工作。

function getCon(type,id)
    {
        var postData = { id: id, type: type}
        $.ajax({
            url : 'getcontent.php',
            type : 'post',
            data : postData,                
            success : function( resp ) { 
                var cont = $('#cont', resp).html();

                $('#conta').after(cont);

                $('.text-rotation').owlCarousel({
                    loop: true,
                    dots: false,
                    nav: false,
                    margin: 10,
                    items: 1,
                    autoplay: true,
                    autoplayHoverPause: false,
                    autoplayTimeout: 3800,
                    animateOut: 'zoomOut',
                    animateIn: 'zoomIn'
                });
            }               
        });
    }

不調用“ $（'。text-rotation'）。owlCarousel”時，它僅以列表格式顯示文本。

為了使所有ajax加載內容在所有部分（即滑塊，彈出窗口等）上都能正常工作。我將必須找到相關的主題函數，並在各自的ajax函數上對它們進行編碼。

我可以在ajaxComplete上調用任何預定義的js代碼，以便所有ajax內容在頁面加載時都可以正常工作嗎？

我試圖從ajax成功內的“ getScript”函數調用main.js，但無法正常工作。

Answer 1

最簡潔的答案是不。

jQuery代碼對代碼運行時存在的DOM起作用； 如果稍后再添加到DOM，則jQuery代碼沒有任何通用的方法可以回過頭來對新元素進行操作，就好像它們首先出現在其中一樣。

您的選擇是

1. 重寫代碼以不依賴於事件綁定/對基於AJAX的內容的操作-而是對始終存在的元素使用委托的事件綁定
2. 將主代碼初始化推遲到所有AJAX調用完成之后，因此在添加綁定時DOM已經存在
3. 編寫特定的代碼以添加必要的事件綁定/在加載新添加的DOM塊時分別對其進行修改