I'm trying to duplicate a field input like this in JSFiddle
But when I save the below in a html file, it is not working.
Can someone please assist?
<html>
<head>
<script>
$(function() { // <== Doc Ready
$("#email").change(function() { // When email is changed
$('#mail').val(this.value); // copy it over to mail
});
});
</script>
</head>
<body>
<input type="text" name="email" id="email" />
<input type="text" name="mail" id="mail" />
</body>
</html>
Your function is working as expected.
The only issue with your code was the jQuery was not loaded to the snippet.
But instead of change, if you use keyup or input, you could see the changes right on time
Change will be triggered only when you focus away from your input.
$(function() { // <== Doc Ready
$("#email").on('keyup', function() { // When email is changed
$('#mail').val(this.value); // copy it over to mail
});
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" name="email" id="email" />
<input type="text" name="mail" id="mail" />This code will run for sure.
$(document).ready(function() {
$('#email').keyup(function(e){
$('#mail').val(e.target.value);
})
});<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<input type="text" name="email" id="email" />
<input type="text" name="mail" id="mail"/>