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/で使用されているアプローチを取ることができます

すなわち

タグを使用して要素に添付された日付/時刻を保持しますが、ユーザーには日付部分のみを表示します。

<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クリックすると、日付を取得してポップアップ URL に渡すことができます

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

    });
});
于 2012-07-13T11:37:36.443 に答える