6

intl-tel-input を使用しようとしています... https://github.com/Bluefieldscom/intl-tel-input#utilities-script

シートの上部にcssを含めました

<link rel="stylesheet" href="css/intlTelInput.css">

私のフォームは真ん中に「tel」IDがあります...フォームの一部を検証するためにパセリも使用していますが、うまく機能しています。

<input class="form-control input-sm"  id="tel" name="tel" type="tel" data-parsley-required>

そして、私のページの一番下に、jquery、bootstrap などを含めました...そして intl-tel-input js....

 <script src="js/jquery.js"></script>
 <script src="js/bootstrap.min.js"></script>
 <script src="js/parsley.js"></script>
 <script src="js/intlTelInput.min.js"></script>

そして、ユーティリティを初期化します...

$("#tel").intlTelInput({
            utilsScript: "js/utils.js"
});

フォーム要素が国旗を取得するため、プラグインは機能しているように見えますが、検証は行われていません。utils.js ファイルは、ファイルの「コンパイル済み」バージョンであり、これを使用するのが正しいと思いますが、コンパイル済みバージョンとコンパイル済みバージョンの両方を試しました。

ここで何が欠けていますか？検証と書式設定が機能しないのはなぜですか?

ありがとう。

4

3 に答える 3

9

検証を機能させるには、utils.js 検証関数を呼び出す必要があります。以下の例を参照してください。

$("#tel").change(function()
{
  var telInput = $("#tel");
  if ($.trim(telInput.val())) 
  {
    if (telInput.intlTelInput("isValidNumber")) 
    {
      console.log(telInput.intlTelInput("getNumber"));
      alert('Valid' );
    }
    else 
    {
      console.log(telInput.intlTelInput("getValidationError"));
      alert('invalid');
    }
  }
});

于 2016-07-21T07:32:53.563 に答える