Javascript 将阵列推送到阵列
我正在尝试搜索播放列表,我可以很好地完成这一部分,当我尝试将它们组织到一个2d数组中时,结果会被推送到每个播放列表中,而不是它所属的播放列表中Javascript 将阵列推送到阵列,javascript,jquery,arrays,Javascript,Jquery,Arrays,我正在尝试搜索播放列表,我可以很好地完成这一部分,当我尝试将它们组织到一个2d数组中时,结果会被推送到每个播放列表中,而不是它所属的播放列表中 var search_results = []; var result = []; //loop through playlists $('#playlist-menu .row').each(function(){ var playlist_name = $
var search_results = [];
var result = [];
//loop through playlists
$('#playlist-menu .row').each(function(){
var playlist_name = $('.name', this).text();
//make the playlist active
$('#playlist-menu .row').removeClass('selected');
$(this).addClass("selected");
//loop through songs in this playlist
$("#media-panel .row").each(function(){
var author = $('.author', this).text();
var title = $('.title', this).text();
if( author.toLowerCase().indexOf(commands[1]) >=0 || title.toLowerCase().indexOf(commands[1]) >= 0){
//found a match
result.push({'author':author,'title':title});
}
});
if(result.length>0){
search_results[playlist_name] = result;
result = [];
}
});
console.log(search_results);
我的结果比这要大得多,但这是我得到的一个样本
[60s: Array[2], 70s: Array[2], 80's: Array[2], 90s: Array[2], Accapella: Array[2]…]
60s: Array[2]
0: Object
author: "everything I can't have"
title: "Robin Thicke [STEP UP 2]"
__proto__: Object
1: Object
author: "Toxic"
title: "16bit Dubstep Mix ( Yael Naim Vocals )"
__proto__: Object
length: 2
__proto__: Array[0]
70s: Array[2]
0: Object
author: "everything I can't have"
title: "Robin Thicke [STEP UP 2]"
__proto__: Object
1: Object
author: "Toxic"
title: "16bit Dubstep Mix ( Yael Naim Vocals )"
__proto__: Object
length: 2
__proto__: Array[0]
80's: Array[2]
正如你所看到的,它只是进入每一个播放列表
有人知道我做错了什么吗
再次更新
我正在为媒体面板创建一个bookmarklet,它只存在一次,并且不在同一个DOM对象中。但是,我添加了子选择器以确保这不是问题所在。我认为通过将类更改为selected会触发播放列表处于活动状态,从而使媒体显示在媒体面板中。然后我试着把它拆开,这样我就能看到它工作了。我增加了一些延迟点击,检查我的目标等。我似乎不能模仿用户体验,这是需要得到的媒体面板填充
也就是说,因为媒体面板没有改变,所以我得到了重复的数据
因此,留给我的是,为什么jquery单击事件结果与用户单击事件不同?我认为您在
媒体面板的查询中缺少了范围。假设dom的结构是这样的
<div id='playlist-menu'>
<div class='row'>
<div class='name'>60's</div>
<div id='media-panel'>
<div class='row'>
<div class='author'>60's author 1</div>
<div class='title'>60's title 1</div>
</div>
<div class='row'>
...
</div>
<div class='row'>
...
</div>
</div>
</div>
<div class='row'>
<div class='name'>70's</div>
<div id='media-panel'>
<div class='row'>
<div class='author'>70's author 1</div>
<div class='title'>70's title 1</div>
</div>
<div class='row'>
...
</div>
</div>
</div>
</div>
到
或
当然-我假设DOM结构。如果我对此不感兴趣,请发布一段实际的HTML
编辑:另外,我想到,如果这个dom是正确的,那么您可能有多个媒体面板
元素,这可能会导致问题,因为每个页面都应该有唯一的id
元素。您可能需要media panel
成为一个类,而不是一个id,才能使事情顺利进行。您的代码中有几处错误。最重要的是,代码不能按预期工作的主要原因是,选择器错误。您正在使用
$('#playlist-menu .row').each()
//...
("#media-panel .row").each()
您正在使用,它分别在#playlist menu
和#media panel
下选择具有.row
类的任何元素。这会导致您选择歌曲两次;一次用于播放列表菜单循环,另一次用于媒体面板循环。您应该改为使用来定位正确的元素
$('#playlist-menu > .row').each()
//...
(".media-panel .row").each()
另外,我不明白为什么在遍历元素以编制索引时添加和/或删除。selected
类
最后,当检查是否存在带有indexOf
的内容时,您应该检查是否等于-1
。在这种特定情况下,您的使用不会破坏您的代码,但在其他一些情况下可能会这样做
这是一把小提琴。我相信它可以按照您的要求工作:
Edit:我忽略的另一个错误是,@rogers先生指出,ID
s在DOM中应该是唯一的。将您的媒体面板
更改为类
es。如果您将内容包装在一个提琴或片段中,将更容易发现问题。您的逻辑似乎正确。您在哪里定义命令?$(“#media panel.row”)
这将选择媒体面板
内部具有class行
的每个项目。它不会对您正在使用的播放列表执行任何特定操作。我猜这是你的问题?另外,您处理的最后一行将选择类,
,其他任何内容都不会选择。@mplungjan命令[1]只是一个字符串,问题不在于get results。它是将结果放入一个数组中,我有一个游戏玩家数组,每个人都有一个matched@Ozan我会看看我是否能编一张提琴感谢你的努力,不管出于什么原因,我似乎能让播放列表被选中。不幸的是,我试图修改的站点的UI相当复杂。我猜我还得问一些其他的问题来弄清楚我需要做些什么才能让它工作也许你可以澄清一下你在哪里尝试点击的东西?例如,$('#playlist menu.row').removeClass('selected')
和$(this).addClass(“选定”)代码>发生了什么?或者您在哪里尝试了$(此)。单击()
?您将这些调用放在何处将非常重要,因为它将定义此
是什么。
$(this).find('#media-panel .row').each( ... )
$('#playlist-menu .row').each()
//...
("#media-panel .row").each()
$('#playlist-menu > .row').each()
//...
(".media-panel .row").each()