加载外部脚本时出现问题,当我从视图中加载该脚本时,该脚本有效

Problems loading external script that worked when I loaded it from my view

本文关键字:脚本 加载 视图 外部 有效 问题      更新时间:2023-09-26

脚本最初位于我的EJS视图中,夹在一些漂亮的脚本标记之间。我把它移到了一个外部文件中,起初它根本不起作用,我的点击监听器什么也没做。然后我把它移到页面底部,就在body标签的外面,这让它有时可以工作,当它工作时,它比以前慢得多。这是我第一次使用pageinit而不是document。嘿,我想这就是为什么我不能弄清楚我的问题是什么。这是代码。谢谢你的帮助。

var currentList;
var elementID;
var id;
$('#mowingmaster').on('pageinit', function (event) {
    $('li').each(function (index) {
        var elementID = $(this).attr('id');
        elementID = '#' + elementID;
        $(function () {
            $(elementID).click(function (event) {
                var elementID = $(this).attr('id');
                id = elementID;
                elementID = '#' + elementID;
                setElementID(id);
                $.mobile.changePage("#dailylist");
            });
        });
    });
    $("#dailylist").on("pagebeforeshow", function (event, ui) {
        $("#testhide").hide()
        setCurrentList(elementID);
    });
    $("#dailylist").on("pageshow", function (event, ui) {
    });
});
function setElementID(id) {
    id = id;
}
function setCurrentList() {
    var currentList = id;
    $.ajax({
        type: "POST",
        url: "/scape/mowinglist",
        data: {
            currentList: currentList
        },
        success: function (data) {
        }
    });
};

这是我第一次使用pageinit而不是document.ready

$('#mowingmaster').on('pageinit', function (event) {

要做到这一点,元素#mowingmaster必须在该代码段运行时已经存在——如果不存在,选择器将不返回任何内容,因此没有任何内容可以将事件与on绑定。

document.ready的使用方式不同——通常在文档准备好后才开始执行代码,然后将事件绑定到该代码中。

请查看pageinit:的文档

$( document ).on( "pageinit", "#aboutPage", function( event ) {

他们在这里将这个事件绑定到document,并为应该使用的元素(#aboutPage)提供一个选择器——这也是应该使用它的方式。(document从一开始就"始终"可用,而DOM元素在脚本执行时可能还不存在。)