入力タイプ= "file" =ファイルが選択されている場合、 "valid"を返す方法は？

Question

私はjqueryを使用し、私のフォームにはjquery validate pluginを使用しています。

input_17の内容がlength > 1の場合は、ファイルinput_1_67を選択する必要があります。それは動作します。

 input_17: { 
     required: function(element) { 
      return $("#input_1_67").val().length > 1 
     } 
    } 

さて、利用者iがinput_17に「有効」クラスを返したいファイルを選択している場合。どのように私はこのクラスを得ることができる任意のアイデア？そして：私はこのクラスを追加したい場合にのみ

$("#input_1_67").val().length > 1 

とファイルが選択されています。

Answer 1

jQueryバリデータープラグインを使用している場合、入力にクラスを追加する必要はありません。バリデーターはこれを行います。

私が知っている限り、ブラウザはファイルパスを読み取らせたり、それを設定することはできません。あなたが得ることができる唯一のものは、ファイル名です。これは、不正なファイルへのアクセスを防ぐためのセキュリティ制限です。値を取得することによってファイル名を取得できます。これを取得すると、ファイルタイプの検証をさらに行うことができます（ただし、クライアントでは信頼できません）。 、

jQuery.validator.addMethod("filetype", function(value, element) { 
    var types = ['jpeg', 'png', 'gif'], 
     ext = value.replace(/.*[.]/, '').toLowerCase(); 

    if (types.indexOf(ext) !== -1) { 
     return true; 
    } 
    return false; 
}, 'Insert invalid message here'); 

は少し上記より再利用可能にする機能のうち、ファイルタイプの配列を取得し、それらを渡す：あなたは、ファイルの種類を確認するためにバリにカスタムルールを追加したいなら、あなたはこれを行うことができます関数のパラメータとして使用します。 http://docs.jquery.com/Plugins/Validation/Validator/addMethod#namemethodmessage

第2に、ファイル入力をクリックするか「ブラウズ」ボタンをクリックすると、ファイルダイアログが開きます。したがって、入力に含めるべき唯一のものはファイル名です。

これらの前提を使用すると、フィールドの有効性は、何かが存在するかどうかを確認する簡単なチェックになります。

Answer 2

あなたは単にすなわち、所望の入力にchangeイベントをバインドすることができます：

$('#input_1_67').change(function(){ 
    $(this).addClass('valid'); 
}); 

Answer 3

$('#input_1_67').change(function(){ 
    if($("#input_1_67").val().length > 1) 
     $("#input_17").addClass('valid'); 
    else 
     $("#input_17").removeClass('valid'); 
    } 
}); 

をまた、あなたはjqueryのバリデータを使用している場合、あなたは

$('#input_1_67').change(function(){ 
    $("#input_17").valid(); 
}); 

これを試してみたいことがありますバリデータメソッドを起動します（input_17の有効性はinput_1_67に依存するため、input_1_67が変更されるたびにバリデーションを行う必要があります）。プラグインは自動的にcssクラスを設定します。