Question

我是javascript的新手，我的任务是编辑一段代码，将dd / mm / yyyy从用户的输入转换为dd / MMM / yyyy

<p:calendar

id="testDate" 
styleClass="calendar"
maxlength="10"
pattern="dd/MMM/yyyy"
onfocus="$(this).mask('99/99/9999');">

</p:calendar>`

我已经更改了datepicker部分（当用户从datepicker中选择一个日期时，它将显示为＆＃39; 12 / Jan / 2013＆＃39;而不是＆＃39; 12/01/2013＆＃39; ）现在我需要修复手动输入部分。

因此，当用户输入＆＃12; 12/12 2012＆＃39;并且用户点击该字段后，日期将自动转换为＆＃39; 12 / Dec / 2012＆＃39;无需重新加载页面或提交表单。

据我所知，有一种名为“onblur＆＃39;但它只返回当天的日期而不是我输入的日期。此外，即使我点击我的日期选择器中的日期，它也会被激活。

我唯一可以使用的页面是xhtml页面，托管bean和javascript。

Answer 1

您需要通过javascript更改日期格式。无需去服务器。

你知道如何调用javascript函数吗？如果是，请参阅此link

使用@maerics

中的以下代码尝试答案

function convertDate(inputFormat) {
  function pad(s) { return (s < 10) ? '0' + s : s; }
  var d = new Date(inputFormat);
  return [pad(d.getDate()), pad(d.getMonth()+1), d.getFullYear()].join('/');
}

=======================编辑======================= ================= 试试这个

<?xml version="1.0" encoding="UTF-8"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"
    xmlns:h="http://java.sun.com/jsf/html"
    xmlns:f="http://java.sun.com/jsf/core"
    xmlns:ui="http://java.sun.com/jsf/facelets"
    xmlns:p="http://primefaces.org/ui">

<h:head>
<script  type="text/javascript">
function CompareDates( id)
{
    var weekday = new Array(7);
     weekday[0]=  "Sunday";
     weekday[1] = "Monday";
     weekday[2] = "Tuesday";
     weekday[3] = "Wednesday";
     weekday[4] = "Thursday";
     weekday[5] = "Friday";
     weekday[6] = "Saturday";

     var months = new Array(12);
     months[0]=  "JAN";
     months[1] = "FEB";
     months[2] = "MAR";
     months[3] = "APR";
     months[4] = "MAY";
     months[5] = "JUN";
     months[6] = "JUL";
     months[0]=  "AUG";
     months[1] = "SEP";
     months[2] = "OCT";
     months[3] = "NOV";
     months[4] = "DEC";

    var d = new Date(id);
    var retVal =weekday[d.getDay()]+' '+ d.getDate()+' '+ months[d.getDate()]+','+d.getFullYear()
    return retVal;     }

</script>
</h:head>
<h:body>
    <h1>Hello World PrimeFaces</h1>

    <h:form>
        <p:calendar id="testDate" styleClass="calendar" maxlength="10"
            pattern="EEE, dd MMM, yyyy" onfocus="$(this).mask('99/99/9999');"
                onchange="$(this).val(CompareDates($(this).val()))"
            >
        </p:calendar>

<Br/>
                <p:calendar id="testDate1" styleClass="calendar" maxlength="10"
            pattern="EEE, dd MMM, yyyy" onfocus="$(this).mask('99/99/9999');"

            >
        </p:calendar>
    </h:form>

</h:body>
</html>

将用户输入的dd / mm / yyyy转换为输出dd / MMM / yyyy而无需在javascript中提交表单或重新加载页面

1 个答案: