JSFiddle - React, Tailwind, and code Playground
HTML
<form>
<input id="input1" name="input1" type="text" value="red" />
<input id="input1" name="input2" type="text" value="blue" />
</form>
JavaScript
var currentUlValues = {};
currentUlValues['input1'] = "red";
currentUlValues['input2'] = "blue";
needToConfirm = true;
$(window).on('beforeunload', function(){
var is_return = false;
if (needToConfirm) {
$.each(currentUlValues, function(key, value) {
var elem = $("#"+key).val();
if (typeof elem !== 'undefined') {
if (elem != currentUlValues[key]) {
is_return = true;
return false;
}
}
});
if (is_return) {
return 'Are you sure you want to leave?';
}
}
});