Question

<div class="right_channel_bar" id="channel_box" style="margin-left: -12px;">
    <div class="row" id="channel_1">
        <span class="program" data-start-time="00:00" data-end-time="00:30" style="margin-left: 0px">
            <a class="truncate" style="width: 180px; href=" javascript:void(0); "=" ">bing technology network</a></span><span class="program " data-start-time="00:31 " data-end-time="01:00 " style="margin-left: 6px "><a class="truncate " style="width: 174px; href=" javascript:void(0);"="">songs</a>
        </span>
        <span class="program" data-start-time="01:02" data-end-time="02:00" style="margin-left: 12px">
            <a class="truncate" style="width: 348px; href=" javascript:void(0); "=" ">news channel</a></span><span class="program " data-start-time="02:05 " data-end-time="03:00 " style="margin-left: 30px "><a class="truncate " style="width: 330px; href=" javascript:void(0);"="">evenst</a>
        </span>
        <span class="program" data-start-time="03:00" data-end-time="04:00" style="margin-left: 0px">
            <a class="truncate" style="width: 360px; href=" javascript:void(0); "=" ">microsoft technology network</a></span><span class="program " data-start-time="04:00 " data-end-time="04:45 " style="margin-left: 0px "><a class="truncate " style="width: 270px; href=" javascript:void(0);"="">yahoo technology network</a>
        </span>
    </div>
    <div class="row" id="channel_2">
        <span class="program" data-start-time="00:00" data-end-time="00:30" style="margin-left: 0px">
            <a class="truncate" style="width: 180px; href=" javascript:void(0); "=" ">bing technology network</a></span><span class="program " data-start-time="00:31 " data-end-time="01:00 " style="margin-left: 6px "><a class="truncate " style="width: 174px; href=" javascript:void(0);"="">songs</a>
        </span>
        <span class="program" data-start-time="01:02" data-end-time="02:00" style="margin-left: 12px">
            <a class="truncate" style="width: 348px; href=" javascript:void(0); "=" ">news channel</a></span><span class="program " data-start-time="02:05 " data-end-time="03:00 " style="margin-left: 30px "><a class="truncate " style="width: 330px; href=" javascript:void(0);"="">evenst</a>
        </span>
        <span class="program" data-start-time="03:00" data-end-time="04:00" style="margin-left: 0px">
            <a class="truncate" style="width: 360px; href=" javascript:void(0); "=" ">microsoft technology network</a></span><span class="program " data-start-time="04:00 " data-end-time="04:45 " style="margin-left: 0px "><a class="truncate " style="width: 270px; href=" javascript:void(0);"="">yahoo technology network</a>
        </span>
    </div>
</div>

从上面提到的HTML中，我需要获取data-start-time，但我无法获取。请帮我修复下面的jquery代码：

$('#channel_box .row').each(function () {
    $(this).children(".program").each(function () {
        console.log($(this).data('start-time') + ' - ' + $(this).data('start-time'))
    });
});

Answer 1

尝试：

console.log($(this).attr('data-start-time') + ' - ' + $(this).attr('data-start-time'))

Answer 2

你的jQuery代码运行正常，这是你的标记问题。

我相信这是现在的非转义引用：

javascript:void(0);"="">b

如果您正确格式化HTML，如下所示（以及JSFiddle中），它将正常工作。

<div class="right_channel_bar" id="channel_box" style="margin-left: -12px;">
   <div class="row" id="channel_1">
      <span class="program" data-start-time="00:00" data-end-time="00:30" style="margin-left: 0px"></span>
      <span class="program" data-start-time="00:01" data-end-time="00:30" style="margin-left: 0px"></span>
   </div>
   <div class="row" id="channel_2">
      <span class="program" data-start-time="00:00" data-end-time="00:30" style="margin-left: 0px"></span>
      <span class="program" data-start-time="00:01" data-end-time="00:30" style="margin-left: 0px"></span>
   </div>
</div>

http://jsfiddle.net/vx7vv6tm/1/

另外，您可能需要考虑使用CSS类并删除内联样式。

嵌套的foreach jquery孩子

2 个答案: