如何在document.ready上操作在document.ready上创建的元素
这是场景：我有一个menubar.js脚本，当页面加载时，它会查询服务器以获取用户的权限，然后根据它们创建一个菜单栏。 代码段：
$(function () { //initialize the header buttons according to user's permissions InitializeCurrentUser(); }); function InitializeCurrentUser() { //get current user $.ajax( { url: "../Login/LoginService.asmx/GetCurrentUser", success: function (result) { var currentUserRoles = result.d; output = ' '; if ($.inArray("reports", currentUserRoles) > -1) { output += '- Reports
'; } //etc... console.log('generating menu'); $("#HeaderMenu").html(output); } }); }
这个脚本包含在我的所有页面中。
现在，我想用
标记代表当前页面的
。 我已经将
var currentPage添加到我的menubar.js脚本和每个页面上（例如，在reportsPage.js中）：
$(function() { //set this page as the current page; currentPage = Enum.Page.Reports; });
在menubar.js中：在document.ready上调用的函数：
function SetCurrentPage() { $("#HeaderMenu li").removeClass('current'); var liElement = null; switch (currentPage) { case Enum.Page.Reports: liElement = $("#lnkReports"); break; } console.log('adding a class to: '); console.log(liElement); liElement.addClass('current'); }
我得到的日志是：
> generating menu > adding a class to: > []
所以看来我正在寻找的元素尚未添加到DOM中。
我认为应该有一些使用live()解决方案，但是当我尝试live('load',...)它永远不会被调用…
我的问题解决方案是生成JavaScript，其中包括：
var BASE_URL = 'http://server/app/...'
我的所有url都是BASE_URL绝对或相对。 这样，我可以简单地查找转到当前页面并向其添加类“current”的所有链接（获取当前页面的URL，切断BASE_URL并使用生成的字符串查询a[href="..."]
对于你的解决方案，我认为问题是你在页面加载后运行SetCurrentPage() ，你应该在“加载菜单”AJAX调用返回后调用它。
将调用移到两个方法到InitializeCurrentUser()成功回调的结尾，它应该可以工作。
你在currentPage之前忘记了var
$(function() { //set this page as the current page; var currentPage = Enum.Page.Reports; });
确保在dom.ready事件之后调用函数SetCurrentPage