如何将其从 PHP 转换为 JavaScript？答案

【问题标题】：How do I convert this to JavaScript from PHP?如何将其从 PHP 转换为 JavaScript？
【发布时间】：2012-03-26 17:07:40
【问题描述】：

如何在 PHP 的 Javascript/jQuery 中执行此操作？我正在尝试从开始日期最多提前 6 个月填充选择列表。

    $startDate =  intval( $c->getStartDate($pid) );
    $endDate =  strtotime('+6 month', $startDate);
    $dateSelectList = '<select name="dateSelect" id="dateSelect">';
    $count = 1;
    //populates the select list with the starting date of the course up to the next six months
    for($date = $startDate; $date <= $endDate ; $date = strtotime('+1 day', $date))
    {
        $dateSelectList .= '<option id="select'.$count.'" value="'.$date.'">'.date('D d F Y', $date).'</option>';
        $count++;
    }

    $dateSelectList .= '</select>';

【问题讨论】：

到目前为止你有什么想法？
我看不到 JavaScript 在哪里进入图片...

标签： php javascript time

【解决方案1】：

您可以做到这一点的一种方法是将 ajax 与 jQuery 结合使用。所以第一步是将你的代码修改为：

$startDate =  intval( $c->getStartDate($pid) );
$endDate =  strtotime('+6 month', $startDate);
$dateSelectList = '';
$count = 1;
//populates the select list with the starting date of the course up to the next six months
for($date = $startDate; $date <= $endDate ; $date = strtotime('+1 day', $date))
{
    $dateSelectList .= '<option id="select'.$count.'" value="'.$date.'">'.date('D d F Y', $date).'</option>';
    $count++;
}

echo $dataSelectList;

然后保存到一个单独的文件中说populate.php

然后在 html 页面上编写以下代码。代码假定您已将 jquery 包含到您的页面中，并且您有一个 id = dateSelect 的 select 元素

<script>
$(function(){
   $.get('populate.php',function(data)
   {
       $('#dateSelect').html(data);
   }
});
</script>

以上代码在页面加载时调用populate.php，返回所有选项并注入到select元素中

【讨论】：

是的，这就是我所做的，但我意识到选择列表并不是我将使用 jquery 操作的唯一事情，这意味着我将向 jquery 传递多个数据集。

【解决方案2】：

您搜索的应该或多或少是它：

<html>
<head>
    <title>Demo Javascript populing select field</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" ></script>
    <script type="text/javascript" >
        $("document").ready(function(){
            nElement = 6;
            sList = {};
            for (i = 0; i<=nElement; i++) {
                var now = new Date();
                var nextDate = new Date();
                nextDate.setMonth(now.getMonth()+(i*6));
                var value = nextDate.getMonth()+"/"+nextDate.getFullYear();
                sList[value] = value;
            }


            $.each(sList, function(key, value){
                var option = $("<option></option>").attr("value",key).text(value);
                $("#demo-select").append(option);

            });
        });
    </script>
</head>
<body>
    <select name="demo-select" id="demo-select" ></select>
</body>

【讨论】：

【解决方案3】：

这是我对代码的 php -> javascript 端口的尝试。 6 个月期间的确切天数取决于该期间的开始和结束日期，因此如果您需要确切的 6 个月范围，则需要根据所涉及的每个月的天数进行更多计算。下面的代码假设在 6 个月的时间范围内有 182 天。

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
        <title>Untitled Document</title>
    </head>

    <script>
        function newOption(value, text) {
            var opt = document.createElement('option');
            opt.text = text;
            opt.value = value;
            return opt;
        }

        function formatDate(date) {
            var da = ['Sun','Mon','Tue','Wed','Thu','Fri','Sat'],
                ma = ['January','February','March','April','May','June','July','August','September','October','November','December'], 
                dr = date.getDate(),
                wr = date.getDay(),
                mr = date.getMonth(),
                yr = date.getFullYear(),
                dn = da[wr],
                ds = (dr.toString().length == 1) ? '0' + dr.toString() : dr.toString(),
                mn = ma[mr],
                ys = yr.toString(),
                v = dn + ' ' + ds + ' ' + mn + ' ' + ys;

            return v;
        }

        function PopulateDateSelector(startDate, endDate, selector) {
            while(selector.length > 0) selector.remove(0);

            while(startDate < endDate) {
                selector.add(newOption(startDate.getTime().toString(), formatDate(startDate)));
                startDate.setTime(startDate.getTime() + (24*60*60*1000)); 
            }
        } 


    </script>
    <body>

        <select id="dateSelector"></select>

        <script type="text/javascript">             
            var s = document.getElementById('dateSelector'),
                startDate = new Date(),
                endDate = new Date(startDate.getTime() + (182*24*60*60*1000)); 
                //182 is estimated number of days in a 6 month period.

            PopulateDateSelector(startDate,endDate,s);
        </script>
    </body>
</html>

【讨论】：