javascript - 入力が変更されていないか確認してください

Question

イベントを使用して入力が変更されていないかどうかを確認できますか？change()

私は一緒に作業していて<input type='file' />、ユーザー自身のアクションに変更が加えられていないことをユーザーに警告したいと思います。

今、私は通常のchange()イベントを作成しました：

 // fire the thumbnail (img preview)
$("#file-input").on("change", function () {
    readURL(this); // create the thumbnail
});

私が欠けているものは何ですか？

前のSolutuib：

まあ、私はこれの回避策を見つけました、本当の問題は私がサムネイルを隠すオプションをユーザーに与えることです、そして彼が望むなら、再び開く...

ただし、サムネイルはユーザーが画像を選択した場合にのみ開きます。これは問題です。これは、変更イベントによってこのオプションが開かれるため、変更がない場合はサムネイルが開かないためです。

そのため、サムネイルを非表示にするinput file と、新しいサムネイルに変更し、変更イベントを常に発生させます。

Answer 1

変数を使用して入力の最後の値を格納し、変更イベントの現在の値と比較します。それらが同じである場合、変更は行われませんでした。

var last_value = $("#file-input").val();

$("#file-input").on("change", function () {
    if (this.value === last_value) alert('no change');
    last_value=this.value;
});

編集：または、次のように、入力タグを別のタグにいつでも置き換えることができます。

var $c  = $("#container");
var $f1 = $("#container .f1");

function FChange() {
    alert("f1 changed");

    $(this).remove();
    $("<input type='file' class='f1' />").change(FChange).appendTo($c);
}

$f1.change(FChange);

Answer 2

<input type="file" id="file-input" data-url="intial-value" />

$("#file-input").on("change", function () {
    if($(this).val() != $(this).data('url'){
       //value has changed
       $(this).data('url', $(this).val())
    }
    else{
       return false;
    }

});

Answer 3

 $("#file-input").on("change", function () {
    if($(this).data('last-val')){
        // do something
    } else {
       $(this).data('last-val',$(this).val());
       //do something else
    }
 });