javascript - 将 JavaScript 表存储在变量中

Question

我的目标是从 SQL 数据库中获取一个 cookie 存储提醒日期和时间。然后从那里将 cookie 存储为 JSON cookie 并解析它。从这里开始，我们在设置来自 cookie 的表/行/列数据的同时遍历 cookie。从这一点开始，我们会弹出一个模式，向访问者展示他/她当天有什么提醒。我的想法是遍历 cookie 并检查日期和时间以查看是否有任何已经过去的当前日期和时间，如果是，则将 true 存储到 DatePasted 变量，然后显示模态。然而，这样做的问题是，如果任何一个提醒为真，它将显示列表中的所有提醒。我们只是想向他们展示到目前为止出现的超过当前日期和时间的提醒。有点像 Outlook 提醒。模式是使用 jQuery 创建的。

问题是我需要一种方法来控制显示模态提醒，并且只显示超过 CookieTime 当前日期和时间的实际提醒。 CookieTime 可以在其中包含当天的多个提醒。所以我的想法是循环检查 CookieTime 数据的日期和时间，如果有任何通过，则获取该表行并将其存储到一个变量中以在模式中显示并插入数据行那个过去如果他们有，那么我们需要向他们展示提醒模式。

这是一些伪代码:

var myTable
for (loop through the cookie data and check each entries date and time)

     CookieTime Reminder Date and Time

     if CookieTime < Current Date/Time){
        //Reminder has pasted the current date and time.
        myTable = (First row of table to contain the titles of the table)
       myTable = myTable + (rows of data from the cookie that have passed current date/time)
     }
}

if CookieTime < Current Date/Time){
   Print MyTable (Show the reminders window with data pasted...) 
}

这是我目前的脚本:

//Prepare the variables for the table layout...
var root=document.getElementById('tubData');
var tab=document.createElement('table');
tab.className="mytable";
var tbo=document.createElement('tbody');
var row, cell;
tab.className="mytable";

//Store todays current date and time.
var currDate = new Date();
//Store todays date and time to date.
var date = new Date(currDate.getMonth() + 1 + "-" + currDate.getDate() + "-" + currDate.getFullYear() + " " + currDate.getHours() + ":" + currDate.getMinutes() + ":" + currDate.getSeconds());

    $(document).ready(function(){

        //Grab the Cookie data that mysql created and parse with JSon.
        var reminders = $.cookie('reminders');
        reminders = JSON.parse(reminders);

        //Prepare creating the first row in the table.
        row=document.createElement('tr'); 

        for (var i=0,len=6; i<len; i++){
        // Create the Header of the table.         

            //Check and see if the currDate Date/Time has pasted the CookieTime Date/Time...
            var CookieTime = new Date(reminders[0].reminderdate + ' ' + reminders[0].remindertime); //Cookie Date/Time
            var difference = CookieTime - currDate; //Subtract CookieTime from currDate to see if time pasted.

                if (difference <= 0) {
                //If the Current Date/Time pasted CookieTime lets show the modal.
                    //Show Reminders Modal below...
                    var DatePasted = true;
                }else{
                    //Don't show Reminders Modal below...
                    var DatePasted = false;
                }

                cell=document.createElement('td');

                    //Create the Titles for each Column in the table.
                    switch(i){
                    case 0:
                        cell.innerHTML = "<img src='menubar/ico_delete16.gif' width='16' height='16'>";
                        break;
                    case 1:
                        cell.appendChild(document.createTextNode('Reminder Date'));
                        break;
                    case 2:
                        cell.appendChild(document.createTextNode('Title/Message'));
                        break;
                    case 3:
                        cell.appendChild(document.createTextNode('Priority'));
                        break;
                    case 4:
                        cell.appendChild(document.createTextNode('Call Type'));
                        break;
                    case 5:
                        cell.appendChild(document.createTextNode('Status'));
                        break;
                    }

                    row.appendChild(cell);
                    tbo.appendChild(row);
        }

        //Begin looping through the cookie array data to show on the following rows.
        for (var i=0,len=reminders.length; i<len; i++){

        row=document.createElement('tr');//Create a new row per loop.

            //We will start looping though and showing the data of the cookie per cell. 
            for (var i=0,len=6; i<len; i++){

                cell=document.createElement('td');

                    switch(i){
                    case 0: //Delete box for dismissing or snoozing a reminder.
                        if (reminders[0].tid==''){
                            cell.innerHTML = "<input name='remove" + i + "' id='remove" + i + "' type='checkbox' value='" + reminders[0].tid + "'>"
                        }else{
                            cell.innerHTML = "<input name='remove" + i + "' id='remove" + i + "' type='checkbox' value='" + reminders[0].thid + "'>"
                        }
                        break;
                    case 1: //Date and Time of the reminder here...
                        cell.appendChild(document.createTextNode(reminders[0].reminderdate + ' at ' + reminders[0].remindertime));                
                        break;
                    case 2: //Title and message of the reminder here...           
                        if ((reminders[0].title || '') == "")
                        {
                            cell.innerHTML = "<a href='reader.asp?tid=" + (reminders[0].tid || '') + "&cnt='" + (reminders[0].cnt || '') + "' >" + (reminders[0].message || '') + "</a>"
                        }
                        else
                        {
                            cell.innerHTML = "<a href='reader.asp?tid=" + (reminders[0].tid || '') + "&cnt='" + (reminders[0].cnt || '') + "' >" + (reminders[0].title || '') + '<br />' + (reminders[0].message || '') + "</a>"
                        }
                        break;

                    case 3: //Ticket Priority
                        switch(reminders[0].priority){
                        case 1:
                            cell.appendChild(document.createTextNode('Low'));
                            break;
                        case 2:
                            cell.appendChild(document.createTextNode('Normal'));
                            break;
                        case 3:
                            cell.appendChild(document.createTextNode('High'));
                            break;
                        case 4:
                            cell.appendChild(document.createTextNode('Critical'));
                            break;
                        case 5:
                            cell.appendChild(document.createTextNode('Emergency'));
                            break;
                        default:
                            cell.appendChild(document.createTextNode('Undefined'));
                            break;
                        }
                        break;
                    case 4: //Call Type here...
                        cell.appendChild(document.createTextNode((reminders[0].fieldvalues || '')));
                        break;
                    case 5: //The status of the ticket here...
                        switch(reminders[0].status){
                    case 1:
                        cell.appendChild(document.createTextNode('New'));
                        break;
                    case 2:
                        cell.appendChild(document.createTextNode('Active'));
                        break;
                    case 3:
                        cell.appendChild(document.createTextNode('Pending'));
                        break;
                    default:
                        cell.appendChild(document.createTextNode('Closed'));
                        break;
                        }
                        break;
                    }

                    row.appendChild(cell);
        }
                tbo.appendChild(row);
            }

    tab.appendChild(tbo);
    root.appendChild(tab);

       //Show JQuery Modal only if one of the dates/times has pasted CookieTimes
       if (DatePasted == true){ 
            $('#basic-modal-content').modal({
                escClose:false,
            });
       }
    });

Answer 1

此处 - 未经测试，可能有拼写错误

DEMO

//Prepare the variables for the table layout...
var root=$('#tubData');
var tab=$('<table/>');
tab.attr("class","mytable");
var tbo=$('<tbody/>');
var row, cell;
tab.attr("class","mytable");

//Store todays current date and time.
var currDate = new Date();

$(document).ready(function(){

        //Grab the Cookie data that mysql created and parse with JSon.
        var reminders = $.cookie('reminders');
        reminders = JSON.parse(reminders);

        //Prepare creating the first row in the table.
        row=$('<tr/>');

        // Create the Header of the table.         
        //Check and see if the currDate Date/Time has pasted the CookieTime Date/Time...
        var CookieTime = new Date(reminders[0].reminderdate + ' ' + reminders[0].remindertime); //Cookie Date/Time
        //Subtract CookieTime from currDate to see if time pasted.  
        var difference = CookieTime - currDate;
        var DatePasted = difference <= 0;

        //Create the Titles for each Column in the table.

        row.append('<td><img src="menubar/ico_delete16.gif" width="16" height="16"></td>')
           .append('<td>Reminder Date</td>');
           .append('<td>Title/Message</td>');
           .append('<td>Priority</td>');
           .append('<td>Call Type</td>');
           .append('<td>Status</td>');                   
        tbo.append(row);


        //Begin looping through the cookie array data to show on the following rows.
        $.each(reminders,function(i,reminders){

          row=$('<tr/>');//Create a new row per loop.
          row.append('<td><td><input name="remove' + i + '" id="remove' + i + '" type="checkbox" value="' +
                     (reminders[0].tid==''? reminders[0].tid:reminders[0].thid) +
              '"></td>')
          // Date and Time of the reminder here...
          row.append('<td>'+reminders[0].reminderdate + ' at ' + reminders[0].remindertime+'</td>');
          //Title and message of the reminder here...           
            row.append("<td><a href='reader.asp?tid=" + (reminders[0].tid || '') + "&cnt='" + (reminders[0].cnt || '') + "' >" + (reminders[0].title||'')+(reminders[0].title?'<br />':'') + (reminders[0].message || '') + '</a></td>')
          //Ticket Priority
          var prio = ["Undefined","Low","Normal","High","Critical","Emergency"]
          row.append("<td>"+prio[reminders[0].priority]+"</td>");
          row.append("<td>"+reminders[0].fieldvalues || '')+"</td>");
          row.append("<td>"+['','New','Active','Pending','Closed'][reminders[0].status]+"</td>");
          tbo.append(row);
     });

    tab.append(tbo);
    root.append(tab);

       //Show JQuery Modal only if one of the dates/times has pasted CookieTimes
       if (DatePasted){
            $('#basic-modal-content').modal({
                escClose:false,
            });
       }
 });