diff --git a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.vue b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.vue
index 54293272dfe5b5036c95653995e5fe7ed9b96d6e..1e2cbd3ba6ec14322c4e1ea91b1ec85beba49623 100644
--- a/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.vue
+++ b/dolphinscheduler-ui/src/js/conf/home/pages/dag/_source/formModel/formModel.vue
@@ -260,7 +260,7 @@
     </div>
     <div class="bottom-box">
       <div class="submit" style="background: #fff;">
-        <x-button type="text" @click="close()"> {{$t('Cancel')}} </x-button>
+        <x-button type="text" id="cancelBtn"> {{$t('Cancel')}} </x-button>
         <x-button type="primary" shape="circle" :loading="spinnerLoading" @click="ok()" :disabled="isDetails">{{spinnerLoading ? 'Loading...' : $t('Confirm add')}} </x-button>
       </div>
     </div>
@@ -580,6 +580,7 @@
         }
         this.isContentBox = false
         // flag Whether to delete a node this.$destroy()
+        
         this.$emit('close', {
           item: {
             type: this.cacheBackfillItem.type,
@@ -675,7 +676,11 @@
       this.isContentBox = true
     },
     mounted () {
-
+      let self = this
+      $("#cancelBtn").mousedown(function(event){
+        event.preventDefault();
+        self.close()
+      });
     },
     updated () {
     },