页面验证:内联Javascript

时间:2012-10-14 21:39:46

标签: javascript validation

我正在尝试在http://validator.w3.org/内获取要验证的表单,我有一个表单,其中包含由Javascript创建的选项,以简化用户的日期选择。

内联javascript创建:

  • 当前年份和月份(到达日期)
  • 未来年月(出发日期)

我曾想过将javascript转换为PHP,但有没有办法维护javascript但同时能够通过验证测试?

javascript代码是:

<div class="dateBE">Fecha de llegada</div>
<select class="fieldTRA" id="b_checkin_day" name="checkin_monthday" onchange="checkDateOrder('frm', 'b_checkin_day', 'b_checkin_month', 'b_checkout_day', 'b_checkout_month') ; tickCheckBox('b_availcheck');">
<option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option><option value="31">31</option>

 </select>

 <select class="fieldTRA" id="b_checkin_month" name="checkin_year_month" onchange="checkDateOrder('frm', 'b_checkin_day', 'b_checkin_month', 'b_checkout_day', 'b_checkout_month') ; tickCheckBox('b_availcheck');">

**<script type="text/javascript">
/* <![CDATA[ */
            var monthArray=new Array("enero","febrero","marzo","abril","mayo","junio","julio","agosto","septiembre","octubre","noviembre","diciembre");
var today = new Date();
      var month= today.getMonth();
      var year = today.getFullYear()%100;
      var fullYear=today.getFullYear();
      year=new String(year);
      year=addzero(year);
      var countMonth=month;
      for(var i=0;i<12;i++,countMonth++){
    if(countMonth%12==0 && i>0){
   countMonth=0;
   year++;
   year=new String(year);
   year=addzero(year);
   fullYear++;
    }
    document.writeln("<option value=\""+fullYear+"-"+(countMonth+1)+"\">"+monthArray[countMonth]+" '"+year);
    }
/* ]]> */
</script>
  </select>
</div>**


<div id="homeout">
<div class="dateBE">Fecha de salida</div>


<select class="fieldTRA" id="b_checkout_day" name="checkout_monthday" onchange="tickCheckBox('b_availcheck');">
<option value="1">1</option><option value="2">2</option><option value="3">3</option><option value="4">4</option><option value="5">5</option><option value="6">6</option><option value="7">7</option><option value="8">8</option><option value="9">9</option><option value="10">10</option><option value="11">11</option><option value="12">12</option><option value="13">13</option><option value="14">14</option><option value="15">15</option><option value="16">16</option><option value="17">17</option><option value="18">18</option><option value="19">19</option><option value="20">20</option><option value="21">21</option><option value="22">22</option><option value="23">23</option><option value="24">24</option><option value="25">25</option><option value="26">26</option><option value="27">27</option><option value="28">28</option><option value="29">29</option><option value="30">30</option><option value="31">31</option>

 </select>
 <select class="fieldTRA" id="b_checkout_month" name="checkout_year_month" onchange="tickCheckBox('b_availcheck');">
<script type="text/javascript">
/* <![CDATA[ */
      var monthArray=new Array("enero","febrero","marzo","abril","mayo","junio","julio","agosto","septiembre","octubre","noviembre","diciembre");
      var today = new Date();
      var month= today.getMonth();
      var year = today.getFullYear()%100;
      var fullYear=today.getFullYear();
      year=new String(year);
      year=addzero(year);
      var countMonth=month;
      for(var i=0;i<12;i++,countMonth++){
if(countMonth%12==0 && i>0){
   countMonth=0;
   year++;
   year=new String(year);
   year=addzero(year);
   fullYear++;
}
document.writeln("<option value=\""+fullYear+"-"+(countMonth+1)+"\">"+monthArray[countMonth]+" '"+year);
}

/* ]]> */
</script>
  </select>
</div>

            </div>

表格可以在这里看到:http://www.visitar.com

1 个答案:

答案 0 :(得分:0)

我建议将所有form / html构造逻辑移到PHP。你在这里做的是一些非常模糊的混合,因为你在javascript中为表单添加值,并在服务器上的PHP代码中处理这些值。

如果您正在寻找使用javascript执行此操作的方法,请查看jQuery,它可以帮助您编写不引人注目的JS代码。例如:

$(function() {
    var opt = "";

    // Date calculations left out
    for(var i=0;i<12;i++,countMonth++) {
        opt += "<option value=\""+fullYear+"-"+(countMonth+1)+"\">"+monthArray[countMonth]+" '"+year; 
    });

    $('#b_checkout_month').append(opt);   
}

这个脚本可以包含在头部或者在关闭body标签之前,因为它不依赖于直接文档访问,而是通过jQuery选择器$('#b_checkout_month')引用select选项。