我正在使用引导程序。这是我要在其中显示所有列表项的表。
<table id="playlist_table" class="table table-bordered">
<caption class="text-center">PLAYLIST</caption>
<thead>
<tr>
<th>Song Name</th>
<th>Singer</th>
<th>Film</th>
</tr>
</thead>
<tbody id="palylist_table_data">
</tbody>
</table>
这是我的播放列表:
<ul id="playlist" class="hidden">
<li Src="Ek%20duje%20ke%20vaaste%20serial%20title%20song.mp3" Title="Ek Duje Ke Vasste" Singer="Unkown" Cover="Album images/ek.jpg"> Ek Duje Ke VAste
</li>
<li Src="Lak.mp3" Title="Lakshya ko HAr haal mein Paana HAi" Singer="Shankar Mahadevan" Cover="Album images/lakshya.jpg"> LAkshya
</li>
</ul>
这是我编写的Jquery代码,但是我无法在表中获取任何数据。
$('.playlist li').each(function(){
var song = $(this).attr('Src');
var title = $(this).attr('Title');
var singer = $(this).attr('Singer');
var cover = $(this).attr('Cover');
$('#playlist_table_data').html('<tr>' + '<td>' + '*' + '</td>' + '<td>' + song + '</td>' + '<td>' + singer + '</td>' + '<td>' + title + '</td>' + '</tr>');
});
您有几个选择器问题,以及使用了不正确的jQuery函数html而不是append。
这是一个工作的jsFiddle
请注意下面的修订版jQuery:
// Use a document ready, to be sure it waits until all html is loaded
jQuery(function($) {
// Your ul is ID playlist (#playlist), not CLASS playlist (.playlist)
$('#playlist li').each(function() {
var song = $(this).attr('Src');
var title = $(this).attr('Title');
var singer = $(this).attr('Singer');
var cover = $(this).attr('Cover');
// Your table is #playlist_table, not #playlist_table_data
// using .html() will replace table contents. You want .append(), to add them to the end of the table
$('#playlist_table').append('<tr>' + '<td>' + '*' + '</td>' + '<td>' + song + '</td>' + '<td>' + singer + '</td>' + '<td>' + title + '</td>' + '</tr>');
});
});
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句