2

我创建了一个自定义日历，基本上只是为每个月的每一天创建一个表格单元格。

我想要做的是当用户点击特定日期时，显示一个弹出窗口（将加载一个单独的页面），显示该选定日期的所有事件。

但是我不确定如何设置所选日期的值，以便我可以将其传递到弹出页面。

这是我目前所拥有的：

<td align="center" valign="middle" width="26" height="27s" 
     class="lightBlue dayPopup" style="cursor: pointer;" 
     onMouseOver="javascript:this.className='lightBlueH';
                  document.getElementById('#Request.calID#day#Day(Variables.cellDate)#').style.visibility='visible';"
     onMouseOut="javascript:this.className='lightBlue';
                 document.getElementById('#Request.calID#day#Day(Variables.cellDate)#').style.visibility='hidden';"
     onClick="setDate(#Variables.cellDate#);" id="#Variables.cellDate#">

jQuery代码：

$("##setDate").click(function(date) {
        var viewDate = date;
    });

然后我设置一个变量，将 URL 传递给控制弹出窗口的函数。

有人可以指出我在尝试设置所选日期的值时出错的正确方向吗？

4

2 回答 2

1

您需要利用“this”的力量，它在下面的代码中将引用被点击的单元格。

$("td.yourCalendarCells").click(function() {
            var viewDate =     getDateFromCell(this);   
    }); 


function getDateFromCell(cell){
     return $(cell).attr('id')
}

我不确定您的 Id 属性是什么格式或如何存储 viewDate，因此您可能需要在 getDatefromCell 中做更多的事情来返回日期，但您现在应该有足够的能力来解决这个问题。

于 2012-07-13T11:26:46.173 回答
1

您主要想将日期发送到弹出页面以显示该日期的事件。它很容易您可以采用http://jsfiddle.net/DQ3Bm/中使用的方法

IE

使用标签来保持附加到元素的检测/时间，但仍然只向用户显示日期部分。

<table class="event-calendar">
    <tr>
        <td>
            <time datetime="2013-01-01">1</time>
        </td>
        <td>
            <time datetime="2013-01-02">2</time>
        </td>
    </tr>
</table>

然后在td点击您可以获取要传递给弹出网址的日期

$(document).ready(function(){
    $(".event-calendar td").click(function(){
        alert($(this).find("time").attr("datetime"));

    });
});
于 2012-07-13T11:37:36.443 回答