I have a list that I need to work with navigation buttons and after hitting enter it should run a function to execute ajax.

I load pages and my list inside (mainPage):

<div id="page_view1" class="d-none">
</div>
<div id="page_view2" class="d-none">
</div>
<div id="page_view3" class="d-none">
</div>

For every pages that should show inside another page I add it to mainPage using Javascript and when user hits cancel button I delete content of last page_view that has content.

In every page that loads is a Javascript tag when I delete all of content this tag removes too but browser caches the code and causes interference how can I prevent this.

My code that interferes event after removing from code:

    $(document).keydown(function (e) {
    
        var selectedRowIndex = table.row('.selected').index();
        switch (e.which) {
        case 38:
            if (selectedRowIndex > 0) {
                selectedRowIndex--;
                tbl2.rows().every(function (rowIdx, tableLoop, rowLoop) {
                    if (rowIdx == selectedRowIndex) {
                        this.select();
                    }
                });
            }
            break;
        case 40:
            if (selectedRowIndex < tbl2.rows().count() - 1) {
                selectedRowIndex++;
                tbl2.rows().every(function (rowIdx, tableLoop, rowLoop) {
                    if (rowIdx == selectedRowIndex) {
                        this.select();
                    }
                });
            }
            break;
        case 13:
            act_Select_1();
        case 27:
            load_last_view();
        }
    });