JSFiddle - React, Tailwind, and code Playground

HTML

<form class="account-settings-form" action="">
  <input type="text">
  <button class="cancel-button">Cancel</button>
</form>

JavaScript

var formInputChanged = false;
$(function() {
    // activate modal is field is edited
    $(".account-settings-form input").on("input", function() {
        window.formInputChanged = true;
    });
    $("input[value='Cancel']").click(function() {
        window.formInputChanged = false;
    });

    window.addEventListener('beforeunload', (event) => {
        event.preventDefault();
        if (window.formInputChanged) {
            confirm("You have unsaved changes");
        }
    });
});