我正在查看我的一个具有日历 View 的 SharePoint 2010 页面的源代码，我试图弄清楚为什么元素被绝对定位并出现在构成实际日历框架的表格之后。
例如……
日历是这样创建的:
<tbody><tr>
<th></th><th class="ms-acal-month-top"><nobr><span style="display: inline;">Sunday</span><span style="display: none;">S</span></nobr></th><th class="ms-acal-month-top"><nobr><span style="display: inline;">Monday</span><span style="display: none;">M</span></nobr></th><th class="ms-acal-month-top"><nobr><span style="display: inline;">Tuesday</span><span style="display: none;">T</span></nobr></th><th class="ms-acal-month-top"><nobr><span style="display: inline;">Wednesday</span><span style="display: none;">W</span></nobr></th><th class="ms-acal-month-top"><nobr><span style="display: inline;">Thursday</span><span style="display: none;">T</span></nobr></th><th class="ms-acal-month-top"><nobr><span style="display: inline;">Friday</span><span style="display: none;">F</span></nobr></th><th class="ms-acal-month-top"><nobr><span style="display: inline;">Saturday</span><span style="display: none;">S</span></nobr></th>
</tr><tr class="ms-acal-summary-dayrow">
<th title="May 26 - June 01" rowspan="2" evtid="week" date="5/26/2013"><div class="ms-acal-month-weeksel">
</div></th><td class="" evtid="day" date="5/26/2013"><div>
<nobr>26 </nobr>
</div></td><td evtid="day" date="5/27/2013"><div>
<nobr>27 </nobr>
</div></td><td evtid="day" date="5/28/2013"><div>
<nobr>28 </nobr>
</div></td><td evtid="day" date="5/29/2013"><div>
<nobr>29 </nobr>
</div></td><td evtid="day" date="5/30/2013"><div>
<nobr>30 </nobr>
</div></td><td evtid="day" date="5/31/2013"><div>
<nobr>31 </nobr>
</div></td><td evtid="day" date="6/1/2013"><div>
<nobr>1 </nobr>
</div></td>
</tr><tr class="ms-acal-summary-itemrow">
<td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-day6">
</div></td>
</tr><tr class="ms-acal-summary-dayrow">
<th title="June 02 - June 08" rowspan="2" evtid="week" date="6/2/2013"><div class="ms-acal-month-weeksel">
</div></th><td class="" evtid="day" date="6/2/2013"><div>
<nobr>2 </nobr>
</div></td><td evtid="day" date="6/3/2013"><div>
<nobr>3 </nobr>
</div></td><td evtid="day" date="6/4/2013"><div>
<nobr>4 </nobr>
</div></td><td evtid="day" date="6/5/2013"><div>
<nobr>5 </nobr>
</div></td><td evtid="day" date="6/6/2013"><div>
<nobr>6 </nobr>
</div></td><td evtid="day" date="6/7/2013"><div>
<nobr>7 </nobr>
</div></td><td evtid="day" date="6/8/2013"><div>
<nobr>8 </nobr>
</div></td>
</tr><tr class="ms-acal-summary-itemrow">
<td><div class="ms-acal-day0">
</div></td><td><div class="ms-acal-day1">
</div></td><td><div class="ms-acal-day2">
</div></td><td><div class="ms-acal-day3">
</div></td><td><div class="ms-acal-day4">
</div></td><td><div class="ms-acal-day5">
</div></td><td><div class="ms-acal-day6">
</div></td>
</tr><tr class="ms-acal-summary-dayrow">
<th title="June 09 - June 15" rowspan="2" evtid="week" date="6/9/2013"><div class="ms-acal-month-weeksel">
</div></th><td class="" evtid="day" date="6/9/2013"><div>
<nobr>9 </nobr>
</div></td><td evtid="day" date="6/10/2013"><div>
<nobr>10 </nobr>
</div></td><td class="" evtid="day" date="6/11/2013"><div>
<nobr>11 </nobr>
</div></td><td class="" evtid="day" date="6/12/2013"><div>
<nobr>12 </nobr>
</div></td><td evtid="day" date="6/13/2013"><div>
<nobr>13 </nobr>
</div></td><td evtid="day" date="6/14/2013"><div>
<nobr>14 </nobr>
</div></td><td evtid="day" date="6/15/2013"><div>
<nobr>15 </nobr>
</div></td>
</tr><tr class="ms-acal-summary-itemrow">
<td><div class="ms-acal-day0">
</div></td><td><div class="ms-acal-day1">
</div></td><td><div class="ms-acal-day2">
</div></td><td><div class="ms-acal-day3">
</div></td><td><div class="ms-acal-day4">
</div></td><td><div class="ms-acal-day5">
</div></td><td><div class="ms-acal-day6">
</div></td>
</tr><tr class="ms-acal-summary-dayrow">
<th title="June 16 - June 22" rowspan="2" evtid="week" date="6/16/2013"><div class="ms-acal-month-weeksel">
</div></th><td class="" evtid="day" date="6/16/2013"><div>
<nobr>16 </nobr>
</div></td><td class="" evtid="day" date="6/17/2013"><div>
<nobr>17 </nobr>
</div></td><td class="" evtid="day" date="6/18/2013"><div>
<nobr>18 </nobr>
</div></td><td class="" evtid="day" date="6/19/2013"><div>
<nobr>19 </nobr>
</div></td><td class="" evtid="day" date="6/20/2013"><div>
<nobr>20 </nobr>
</div></td><td evtid="day" date="6/21/2013"><div>
<nobr>21 </nobr>
</div></td><td evtid="day" date="6/22/2013"><div>
<nobr>22 </nobr>
</div></td>
</tr><tr class="ms-acal-summary-itemrow">
<td><div class="ms-acal-day0">
</div></td><td><div class="ms-acal-day1">
</div></td><td><div class="ms-acal-day2">
</div></td><td><div class="ms-acal-day3">
</div></td><td><div class="ms-acal-day4">
</div></td><td><div class="ms-acal-day5">
</div></td><td><div class="ms-acal-day6">
</div></td>
</tr><tr class="ms-acal-summary-dayrow">
<th title="June 23 - June 29" rowspan="2" evtid="week" date="6/23/2013"><div class="ms-acal-month-weeksel">
</div></th><td evtid="day" date="6/23/2013"><div>
<nobr>23 </nobr>
</div></td><td class="" evtid="day" date="6/24/2013"><div>
<nobr>24 </nobr>
</div></td><td evtid="day" date="6/25/2013"><div>
<nobr>25 </nobr>
</div></td><td class="" evtid="day" date="6/26/2013"><div>
<nobr>26 </nobr>
</div></td><td evtid="day" date="6/27/2013"><div>
<nobr>27 </nobr>
</div></td><td evtid="day" date="6/28/2013"><div>
<nobr>28 </nobr>
</div></td><td evtid="day" date="6/29/2013"><div>
<nobr>29 </nobr>
</div></td>
</tr><tr class="ms-acal-summary-itemrow">
<td><div class="ms-acal-day0">
</div></td><td><div class="ms-acal-day1">
</div></td><td><div class="ms-acal-day2">
</div></td><td><div class="ms-acal-day3">
</div></td><td><div class="ms-acal-day4">
</div></td><td><div class="ms-acal-day5">
</div></td><td><div class="ms-acal-day6">
</div></td>
</tr><tr class="ms-acal-summary-dayrow">
<th title="June 30 - July 06" rowspan="2" evtid="week" date="6/30/2013"><div class="ms-acal-month-weeksel">
</div></th><td evtid="day" date="6/30/2013"><div>
<nobr>30 </nobr>
</div></td><td class="" evtid="day" date="7/1/2013"><div>
<nobr>1 </nobr>
</div></td><td class="" evtid="day" date="7/2/2013"><div>
<nobr>2 </nobr>
</div></td><td class="" evtid="day" date="7/3/2013"><div>
<nobr>3 </nobr>
</div></td><td evtid="day" date="7/4/2013"><div>
<nobr>4 </nobr>
</div></td><td evtid="day" date="7/5/2013"><div>
<nobr>5 </nobr>
</div></td><td evtid="day" date="7/6/2013"><div>
<nobr>6 </nobr>
</div></td>
</tr><tr class="ms-acal-summary-itemrow">
<td><div class="ms-acal-day0">
</div></td><td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-outday">
</div></td><td><div class="ms-acal-outday">
</div></td>
</tr>
</tbody>
然后事件在 DOM 中显示为:
<div class="ms-acal-item ms-acal-color5" style="position:absolute;left:810px;top:153px;width:153px;height:37px;" title="ABC
3:00 pm - 4:00 pm ABCMeeting" _index="1,0"><div class="ms-acal-sdiv"><div class="ms-acal-time">3:00 pm - 4:00 pm</div><div class="ms-acal-title"><a target="_blank" href="/sites/asdf/calendars/Lists/abc/DispForm.aspx?ID=3">ABC Meeting</a></div></div></div>
这让我在尝试从浏览器中正确打印日历时感到无尽的挫败感。我的问题是:
在 DOM 后面的 div 中绝对定位元素与仅将事件放在表格单元格元素中的原因是什么？
最佳答案
我不知道这个问题的答案，但认为值得一提的是它在 SP2007 中不是那样工作的。在早期版本中，事件被放置在标签内......
(我正在尝试弄清楚 SP2007 如何让事件在日历中跨越两天或更多天，如果有人愿意分享这方面的任何信息。)
关于html - 为什么事件绝对定位在 SharePoint 2010 日历 View 上？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/17556209/