我有一个用PHP生成的HTML列表结构,它模拟了我的目录结构。
如果我的目录看起来像这样......
• folder A
— file A-1
— file A-2
• folder A-A
— file A-A-1
— file A-A-2
• folder B
— file B-1
• folder B-A
— file B-A-1
— file B-2
我的HTML看起来像这样:
<h2 data-url="folder_A">folder A</>
<ul>
<li data-url="file_A-1">file A-1</li>
<li data-url="file_A-2">file A-2</li>
<h2 data-url="folder_A-A">folder A-A</h2>
<ul>
<li data-url="file_A-A-1">file A-A-1</li>
<li data-url="file_A-A-2">file A-A-2</li>
</ul>
</ul>
<h2 data-url="folder_B">folder B</>
<ul>
<li data-url="file_B-1">file B-1</li>
<h2 data-url="folder_B-A">folder B-A</h2>
<ul>
<li data-url="file_B-A-1">file B-A-1</li>
</ul>
<li data-url="file_B-2">file B-2</li>
</ul>
我想要实现的是当您点击<li>
个父元素的data-url
时,重建folder_B/folder_B-A/file_B-A-1
文件的完整网址。
例如,文件B-A-1 的完整网址为data-url
。
为了实现这一目标,我需要从<h2 data-url="folder_A">folder A</>
,<h2 data-url="folder_B">folder B</>
和<li data-url="file_B-A-1">file B-A-1</li>
检索$('li').click(function(){
var parentUrl = $(this).parent().prev('h2').attr('data-url');
var thisUrl = $(this).attr('data-url');
alert(parentUrl+'/'+thisUrl);
});
,将它们连接到一个数组中并用斜杠分隔它们。
这是我到目前为止的jQuery:
data-url
我的代码仅适用于一位家长,任何想法如何检索更高 <h2>
的所有SELECT o.*
FROM Orderinfo o
WHERE o.OnlineOrderID NOT IN (SELECT OnlineOrderID FROM Orderinfo WHERE Code = 'apple')
并将它们加入一个数组?
您可以更新JSFiddle。
答案 0 :(得分:1)
嗯,实际上我发现了一个在发布问题之前有效的解决方案,但它仍然可以帮助其他人。可能有更好的解决方案......
我使用了array.push();
var rawParentsUrl = [];
$(this).parents('ul').each(function(){
rawParentsUrl.push( $(this).prev('h2').attr('data-url') );
});
完整代码:
$('li').click(function(){
var rawParentsUrl = [];
$(this).parents('ul').each(function(){
rawParentsUrl.push( $(this).prev('h2').attr('data-url') );
});
var thisUrl = $(this).attr('data-url'),
parentsUrl = rawParentsUrl.reverse().join('/'),
completeUrl = parentsUrl+'/'+thisUrl;
alert(completeUrl);
});
更新JSFiddle
答案 1 :(得分:0)
您可以使用.map()
方法。它返回一个jQuery对象,其中包含对集合中每个元素调用函数的结果。您可以使用.get()
将其转换为数组。
var rawParentsUrl = $(this).parents('ul').map(function() {
return $(this).prev('h2').data('url');
}).get();