自動的にハイフンを追加するhtmlパターン

私はユーザーが25文字のキーを入力するテキストボックスを持っています。自動的にハイフンを追加するhtmlパターン

<br><input type="text" name="Key" pattern=".{29}" style="text-transform:uppercase">

thats私の現在のコードです。今私が達成しようとしているのは、ユーザーが最初の5文字をタイプするときです。それは、次の5文字の後ろに追加してください。

最後に11111-11111-11111- 11111-11111

私は研究をしましたが、何も見つかりませんでした。パターンの長さを私が望む長さにして、テキストを自動大文字にしましたが、ハイフンを自動的に追加する方法がわかりません。ここで

出典

2017-04-18 RedZ

あなたがHTMLでこれを行うことはできません。 JavaScriptが必要です。 keyup/keypressイベントを調べて、ボックス内の文字数を数え、必要に応じてダッシュを追加します。 – Utkanos

多分[この記事]（http://stackoverflow.com/questions/11632525/insert-dash-after-every-4th-character-in-input）あなたを助けることができます。 –

@Utkanos私はそれが働いてくれてありがとうございます:) – RedZ

は、uは、いくつかの変更を加えたい場合はJavaScriptで再生してみてください、以下の小さなコードです： -

<html> 
    <head> 
    <SCRIPT LANGUAGE="JavaScript"> 
    function addDashes(f) 
    { 
    f.value = f.value.slice(0,5)+"-"+f.value.slice(5,10)+"-"+f.value.slice(10,15); 
    } 
    </SCRIPT> 
    </head> 
    <BODY> 
    <form> 
    Phone: <input type='text' name='phone' onBlur='addDashes(this)'><BR> 

    </form> 
    </body> 
    </html>

出典

2017-04-18 12:38:52

自動的にハイフンを追加するhtmlパターン

答えて

関連する問題