How does the modal fuzzy box in bootstrap get the click button event?

I encapsulated a js function myself! There are some problems with using
. I set callback, to increase as the number of clicks increases, so does the number of execution. I don"t know why!

functions encapsulated by js

showConfirm(title , content , showCancel , success , cancel)
    {
        showCancel = showCancel === false ? showCancel : true;
        $("-sharpshowModal .modal-title").text(title);
        $("-sharpshowModal .modal-body").text(content);
        if(!showCancel)
        {
            $("-sharpshowModal .cancel").hide();
        }

        $("-sharpshowModal .cancel").eq(0).click(cancel);//DOM
        $("-sharpshowModal .success").eq(0).click(success);//DOM
        $("-sharpshowModal").modal();
    }

Front end call

<button class="btn btn-info btn-sm" onclick="test()">test</button>

<script>
        function test()
        {
            pages.showConfirm("","",true,function(){
                console.log(1);
            },function(){
                console.log(2);
            })
        }
    </script>

the number of times printed in console.log will increase with the number of clicks!

Jquery javascript front-end bootstrap

Mar.03,2021

your < button > uses onclick= "test ()", that is, each click will execute the test () function, and then each time test () executes the content showConfirm will register the click events of .success and .success-- output 1 | 2, that is, each click, one more registration, and then one more output 1 | 2. You can remove the onclick= "test ()" from button and write:

<button class="btn btn-info btn-sm" id="test_button">test</button>

<script>
    $('-sharptest_button').click(showConfirm('','',true,function(){
        console.log(1);
    },function(){
        console.log(2);
    }));
</script>

so that your button can only register a click event.
I hope I can help you.

Previous: Background data transfer

Next: How arttemplate proposes public html, and how to cooperate with java.