jquery - シリアル番号入力フィールドにハイフンを動的に追加する

Question

私は JSF 2.0、jquery 1.9、および javascript を使用しています。RichFaces も持っています (PrimeFaces はありません)。シリアルナンバー入力欄があります。シリアル番号はこの形式です

ABCD-1234-EFGH-5678

数字と数字の任意の組み合わせを使用できます。唯一の制限は: 1) 英数字 2) 正確に 16 文字

ここで、ユーザーの快適さのために、4 文字ごとに「-」を動的に追加する必要があります (もちろん、最後の部分は除きます)。私が持っているものでこれが可能かどうかはわかりません。何か案は？

ありがとう！

-編集-

したがって、jQuery.MaskedInput.js オプションを使用しています。これが私のコードです

<script type="text/javascript">
    // <![CDATA[
    jQuery(function($){
        $("#managerForm\\:computername1").mask("****-****-****-****",{placeholder:"Add Computer ID"});
        $("#managerForm\\:computername2").mask("****-****-****-****",{placeholder:"Add Computer ID"});
        $("#managerForm\\:computername3").mask("****-****-****-****",{placeholder:"Add Computer ID"});
    });
    // ]]>
</script>

しかし、それは機能していません。コンソールには、キャッチされていないエラーがあると表示されます。

Object [object Object] has no method 'mask'

これを輸入しています

<script src="jquery.js" type="text/javascript"></script>
<script src="jquery.maskedinput.js" type="text/javascript"></script>

何か案は？