How can Add the button to the form and make it visible only when the specific field is changed

How can Add the button to the form and make it visible only when the specific field is changed

Add the code to the refresh method or on field change.

E.G:

frappe.ui.form.on('Task', {
    refresh: function(frm) {
        // add custom button code
    },
    field_name: function(frm){
        // add custom button code
    }
});

but after the field is saved its not showing

Dear @Govind_Gupta

frappe.ui.form.on('Your DocType', {
    refresh: function(frm) {
        // Hide the button initially
        frm.remove_custom_button('Your Button');
    },
    your_fieldname: function(frm) {
        // Show the button when the specific field is changed
        if (frm.doc.your_fieldname) {
            frm.add_custom_button('Your Button', function() {
                // Your button action here
                frappe.msgprint('Button clicked!');
            });
        } else {
            frm.remove_custom_button('Your Button');
        }
    }
});