Question

加载页面后，我进行数据库调用（通过ajax / php）获取动态列表。列表显示正常，看起来像这样：

<ul id="menu">
<li><a href="#page-bla">bla</a></li>
<li><a href="#page-bla2">bla2</a></li>
<li><a href="#page-bla3">bla3</a></li>
</ul>

一旦列表完成加载，我想根据我所在的页面动态加载内容，所以我抓住了页面URL，在这种情况下可以说是bla3。我想查看列表并获取包含bla3的li项的URL（href）。

我认为下面这样的东西会起作用，但事实并非如此。

$(document).ready(function() {
    $('#menu').on('load', function(){
        var pageID = $('#menu li a[href$="?bla3"]').attr('href');
        alert(pageID);
    });
});

问题（我假设）是#menu没有足够快地加载，因此onmen事件在#menu加载之前触发，我已经尝试了它与身体，但也没有工作。基本上我只需要在它之后查看动态生成的列表，并且它所在的页面已经完全加载。

有什么想法吗？

Answer 1

<body onload="findList()">

然后您需要在<head>

中使用此功能

<head>
<script type="text/javascript" language="javascript">
function findList() {
var list = document.getElementById("menu").getElementsByTagName("li");
var contains = "bla3";
var patt = new RegExp(contains,"g");
for (var x=0;x<list.length;x++) {
  if (list[x].match(patt).length>0) {
    var hrefVal = list[x].childNodes[0].href;
    alert(hrefVal);
  }
}
}
</script>
</head>

Answer 2

首先，您似乎需要一种等待菜单的方法。您可以尝试轮询元素的DOM。

这是一个粗略的小提琴，似乎模拟了你所描述的内容：http://jsfiddle.net/rkLVx/1/

var menuHasArrived = function (fn) {
    console.log('checking...');
    if ($('#menu').length) {
        fn();
    } else {
        setTimeout(function () {
            menuHasArrived(fn);
        }, 1000);
    }
}

menuHasArrived(function () {
    alert($('#menu li a:contains(bla2)').attr('href'));
});

setTimeout(function () {
    $('body').append(
        '<ul id="menu">' +
        '<li><a href="#page-bla">bla</a></li>' +
        '<li><a href="#page-bla2">bla2</a></li>' +
        '<li><a href="#page-bla3">bla3</a></li>' +
        '</ul>');
}, 2000);

祝你好运

如何在动态创建的列表中查找字符串

2 个答案: