web-dev-qa-db-ja.com

jQueryの入力type = fileでonchangeイベントを処理する方法は？

コードは次のとおりです。

<input ID="fileUpload1" runat="server" type="file"

以下が正常に機能します。

<input onchange="javascript:alert('hola');" ID="fileUpload1"  runat="server" type="file"

JQueryを使用してこの結果を取得したいのですが、うまくいきません。

$('#fileUpload1').change(function (e) {
    alert("hola");
});

私は何かが欠けていますか？ （編集：はい、*。jsファイルのインクルードを見逃しました。）

javascriptjqueryhtmleventsinput
45
anmarti

デモ： http://jsfiddle.net/NbGBj/

$("document").ready(function(){

    $("#upload").change(function() {
        alert('changed!');
    });
});
114
Shabnam K

または：

$('input[type=file]').change(function () {
    alert("hola");
});

具体的には：$('input[type=file]#fileUpload1').change(...

10
Alex Ball

正常に動作するはずです。$(document).ready()呼び出しでコードをラップしていますか？それを使用しない場合、またはliveを使用する場合.

$('#fileupload1').live('change', function(){ 
    alert("hola");
});

これが jsFiddle で、jQuery 1.4.4に対して動作しています。

4
Chris

これは jsfiddle でうまくいきます。

$(document).delegate(':file', 'change', function() {
    console.log(this);
});

注：.delegate（）は、jQuery <1.7の最速のイベントバインディングメソッドです。 event-binding methods

4
Simon

これを使用してみてください：

HTML：

<input ID="fileUpload1" runat="server" type="file">

JavaScript：

$("#fileUpload1").on('change',function() {
    alert('Works!!');
});

2
Arpit Srivastava
 $('#fileupload').bind('change', function (e) { //dynamic property binding
alert('hello');// message you want to display
});

これも使えます

2
Bhushan Pawar