jqueryトラックが変更され、入力エレメントにハイライトが追加されます

Question

値が変更されていることを確認して青いハイライトを追加しますか？これは、入力やチェックボックスなどのフォーム要素用です。

//highlight the fields that have changed 
var trackChanges = $('[class=input-]') 
    .each(function{ 
    var checkChange = false, 
     //check if data has changed 
     if ($(this).data() != $(this).val()) { 
      $(this).addClass('highlight') 
     } 
    } 
}); 

Answer 1

これはどうですか？

HTML：

<input type="text" id="inputText"> 

JAVASCRIPT（使用jQueryの）：

$("#inputText").change(function(){ 
    $("#inputText").addClass('highlight'); 
}); 

https://jsfiddle.net/cjuag8mh/1/

Change Method

Answer 2

私は​​イベントを使用する代わりに、入力時に色を更新します。

$('[class^=input-]').on('keydown', function() { 
 
    $(this).addClass('highlight'); 
 
});

.highlight { 
 
    border: 2px solid #3377ff; 
 
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<table> 
 
    <tr> 
 
    <td>Name: </td> 
 
    <td><input class="input-name" type="text" /></td> 
 
    </tr> 
 
    <tr> 
 
    <td>Age: </td> 
 
    <td><input class="input-age" type="text" /></td> 
 
    </tr> 
 
</table>