5

string.replaceJavascript では、ユーザーに何かを伝える代わりに、その場で入力を検証および変更するように、正規表現と関数を使用してユーザー時間入力を検証および変更するにはどうすればよいですか?

たとえば、ユーザー入力は である可能性があります1.12p 13:12 1,12PMが、最終結果は常に である必要があります1:12 PM

誰かがそうする方法の例を持っていますか?

PS。timepicker を使用する方が効率的な方法であることはわかっていますが、この場合はユーザー入力を使用する必要があります。

4

1 に答える 1

1

出発点として使用できる単純な正規表現:

(\d{1,2})\s*[.,:;]\s*(\d{1,2})\s*(([Aa]|[Pp])[Mm]?)?
^        ^  ^     ^  ^        ^  ^ ^         ^
Hour group  |     |  Minutes  |  | |         M is optional
         |  Valid separators  |  | Case-insensitivity
         |        |           |  AM/PM group
         ------------------------------Allow spaces

時間が有効であることを検証する必要がありますが (59:99 はおそらく有効ではありません)、これにより、少なくとも JavaScript で文字列を解析しやすくなります。解析した後は、必要に応じて印刷することができます。

編集:おっと。JavaScript は名前付きグループをサポートしていないことを忘れていました。同じ効果を得るには、番号付きのグループを使用するだけです。


干し草は何ですか... これは完全に機能する例です。いつ検証するか (および無効な入力をどうするか) は、あなた次第です。

<html>
    <head>
        <script>
function parseTime( timeString ){
    var timePattern = /(\d{1,2})\s*[.,:;]\s*(\d{1,2})\s*(([Aa]|[Pp])[Mm]?)?/;
    var timeMatch = timePattern.exec( timeString );

    var INVALID = null;

    if ( timeMatch !== null ){
        var hour = timeMatch[1];
        var minute = timeMatch[2];
        var ampm = timeMatch[3];

        if ( minute < 0 || minute > 59 )
            return INVALID;

        if ( ampm != "" ){
            if ( hour < 1 || hour > 12 )
                return INVALID;

            ampm = ampm.substring(0,1).toUpperCase() == "A" ? "AM" : "PM";
        } else {
            if ( hour > 23 )
                return INVALID;

            ampm = ( hour < 13 ? "AM" : "PM" );
            hour = hour % 12;
            if ( hour == 0 ) hour = 12;
        }

        return hour + ":" + minute + " " + ampm;
    } else {
        return INVALID;
    }
}

function unitTest(){
    var testStrings = [
        ["1:30 PM", "1:30 PM"],
        ["1.30p", "1:30 PM"],
        ["1;30a", "1:30 AM"],
        ["59:99 PM", null],
        ["0,30", "12:30 AM"],
        ["15:00", "3:00 PM"],
        ["abc", null] ];

    var testResults;
    testResults = "<table><tr><th>Input</th><th>Expected</th><th>Actual</th></tr>";

    for (var i = 0; i < testStrings.length; i++){
        testResults +=
            "<tr>" +
                "<td>" + testStrings[i][0] + "</td>" +
                "<td>" + testStrings[i][1] + "</td>" +
                "<td>" + parseTime( testStrings[i][0] ) + "</td>" +
                "<td>" + ( testStrings[i][1] == parseTime( testStrings[i][0] ) ?
                            "<span style='color:green'>Success</span>" :
                            "<span style='color:red'>Failure</span>" ) +
                "</td>" +
            "</tr>";
    }

    testResults += "</table>";

    this.document.getElementById("results").innerHTML = testResults;
}
        </script>
    </head>
    <body onload="unitTest();">

        <div id="results">
        </div>

    </body>
</html>

出力:

入力 予想される 実際
1:30 PM 1:30 PM 1:30 PM 成功
1.30p 1:30 PM 1:30 PM 成功
1;30a 1:30 AM 1:30 AM 成功
59:99 PM null null 成功
0,30 12 :30 AM 12:30 AM 成功
15:00 3:00 PM 3:00 PM 成功
abc null null 成功

于 2012-10-29T16:33:32.437 に答える