What happens when the mousedown event is clicked and executed three times?

use js to implement a drop-down menu that requires the drop-down box to be folded automatically when the mouse clicks on an area other than the drop-down menu. Now to give a search function to the drop-down menu, dropList is the drop-down box, the search box is located in dropList, and searchKey is a defined variable that holds the input value of the search box input.
the following code shows that the breakpoint tracking shows that the value of searchKey will be retained after three times of dropList.hide (), execution once, and emptied the second time, so that when I open the drop-down box again, the value entered in the search box is empty.
how can I keep the value of the search box from being emptied? Normally, the input value of input will be retained automatically. I don"t know if there is something wrong with my mousedown event. Ask God for advice.

  dropList.mousedown(function(e){
                e.stopPropagation(); //documentmousedown
            });
 $(document).bind("mousedown.fitsCombo",this.globalEvent=function(e){
                console.log(dropList);
                console.log(self.searchKey);
                dropList.hide();//
                console.log(dropList);
                console.log(self.searchKey);
            });
Mar.22,2021
Menu