如何重置输入自动完成样式？

Question

I have a simple Bootstrap form that is proceeded via JavaScript. Once the submit button is clicked, it proceeds its data and resets the input values without reloading the page:

if( json.success ) {
  $('#form_sendemail').find('.form-control').val('');
}

The problem is that if there were any autocompleted form fields (highlighted with yellow in Chrome), they stay highlighted even after the form has been sent and the form fields cleared. How do I reset those styles without reloading the page? (setting background-color to !important didn't help).

Answer 1

Try out the reset function:

$.ajax({
    //...
    success: function (data, status) {
        document.getElementById('yourFormID').reset();
    }
});

<form id="yourFormID"></form>

EDIT:

JQuery (the awesome):

$.ajax({
    //...
    success: function (data, status) {
        $('#yourFormID')[0].reset();
    }
});

Answer 2

You can try this

For Chrome

input:-webkit-autofill {
    background-color: #FAFFBD !important;
color: #2a2a2a !important;
}

Script

$("input[type='text']").bind('focus', function() {
   $(this).css('background-color', '#fff');
   $(this).css('color', '#000');
});