如何拆分或获取div的内容与内部div在新行上分开

时间:2015-08-09 20:57:07

标签: javascript jquery

我有这段代码:

<div id="nlp_selected_day">
  <div class="nlp_months nlp_selected_month_calendar_shown" style="display: inline-block;"><div class="nlp_day_selected_dummy_day"></div>
  <div class="nlp_day_selected_dummy_day"></div>
  <div class="nlp_day_selected_dummy_day"></div>
  <div id="1" class="nlp_day_selected nlp_thursday" value="1" title="Четвъртък"> 1
  <div></div></div>
    <div id="2" class="nlp_day_selected nlp_friday" value="2" title="Петък"> 2
    <div class="calendar_day_container"></div></div>
      
    ......
    <div id="5" class="nlp_day_selected nlp_monday" value="5" title="Понеделник"> 5
    <div class="calendar_day_container">
      <div>8:00 - 8:45 </div>
      <div class="hidden_info">
        <div class="hidden_title">Запазено!</div>
        <div class="hidden_description"><br></div>
        </div>
      <div>8:45 - 9:30 </div>
        <div class="hidden_info">
          <div class="hidden_title">Запазено!</div>
          <div class="hidden_description"><br></div>
          </div>
      <div>9:40 - 10:25 </div>
         <div class="hidden_info">
           <div class="hidden_title">Запазено!</div>
           <div class="hidden_description"><br></div>
           </div>
      <div>10:25 - 11:10 </div>
         <div class="hidden_info">
           <div class="hidden_title">Запазено!</div>
           <div class="hidden_description"><br></div>
           </div>
      <div>11:20 - 12:05 </div>
        ....... 
    <div id="6" class="nlp_day_selected nlp_tuesday" value="6" title="Вторник"> 6
    <div class="calendar_day_container">
      <div>8:00 - 8:45 </div>
        <div class="hidden_info">
          <div class="hidden_title">Запазено!</div>
          <div class="hidden_description"><br></div>
        </div>
      <div>8:45 - 9:30 </div>
        <div class="hidden_info">
          <div class="hidden_title">Запазено!</div>
          <div class="hidden_description"><br></div>
      ......

我对此代码感兴趣:

jQuery('.nlp_day_selected').click(function (){
        var contents = $(this).children('.calendar_day_container').text();
        $('#nlp_show_content').html(contents);
    });

但我希望每次阻止内容分为新行

类似的东西:

  

14:40 - 15:25100минути描述

     

15:25 - 16:10标题说明

     

16:20 - 17:05标题描述

2 个答案:

答案 0 :(得分:0)

虽然我相信您的问题可以更好地表达,但我仍会尝试回答您的问题。

首先,它可能是您的格式,但我认为您有一些没有开放</div>标记的<div>标记,您应该检查是否是实际错误(你可能有复制粘贴错误谁知道)。

此外,我认为您应该对代码进行一些小的更改,以便更容易获得所需的数据。

您应该更改所有类似的代码:

<div>10:25 - 11:10 </div>
   <div class="hidden_info">
   <div class="hidden_title">Запазено!</div>
   <div class="hidden_description"><br></div>

对于这样的事情:

<div class="timeslot_container">   
   <div class="timeslot">10:25 - 11:10 </div>
   <div class="hidden_info">
   <div class="hidden_title">Запазено!</div>
   <div class="hidden_description"><br></div>
</div>

然后,你可以使用jQuery做这样的事情(根据你的需要修改它):

var contents = $("<div></div>");
$('.calendar_day_container').each(function (i, elt) {
    var $htmlForOneDay = $("<div></div>");
    $(elt).find(".timeslot_container").each(function (i, elt) {
        var $singleTimeslot = $("<div></div>");
        $singleTimeslot.append($(elt).find(".timeslot").text()).append(" ");
        $singleTimeslot.append($(elt).find(".hidden_title").text()).append(" ");
        $singleTimeslot.append($(elt).find(".hidden_description").text());
        $htmlForOneDay.append($singleTimeslot).append($("<br/>"));
    });
    contents.append($htmlForOneDay).append("<hr/>"); // you can skip the <hr/> if you want
});
$('#nlp_show_content').html(contents[0]);

我相信这会以您想要的格式获取数据,或者至少引导您朝着正确的方向前进,我希望这可以帮助您:)

答案 1 :(得分:0)

遍历所有@echo off setlocal EnableDelayedExpansion set str=123456789abcdefgh for /l %%x in (1, 1, 10) DO ( set /a intLength=10-%%x SET result=!str:~-%%x! echo Works as intended: !result! for /f %%A in ("!intLength!") do SET result=!str:~-%%A! echo Now works as intended: !result! echo. ) endlocal 类并使用这些实例创建每一行:

hidden_info

您无法完全控制每个行间距和格式