Browser Autocomplete Not Allowing Copy/keyup Function To Work

I am having an issue with some code I wrote. What I am doing is, I am creating an eCommerce checkout page and I have three different sections. 1. Shipping info 2. Billing info 3. O

Solution 1:

One quick solution: add the event listener to the input event instead of to the keyup event. From the MDN reference page:

The DOM input event is fired synchronously when the value of an <input> or <textarea> element is changed

So the code would be like this:

$(document).ready(function() {
  $(".preview").on('input', function() {
    $($(this).data('copy')).html($(this).val());
  });
}); 

I made a demo changing the names so my browser would detect the fields for autofill. You can see it here: http://jsfiddle.net/dc3x6wyu/

Solution 2:

If i got you right,you just want to prevent autocomplete. You could use the HTML5 attribute "autocomplete".

<inputtype="text"autocomplete="off">

This would prevent autocomplete on that field.