輸入更改時提交表單，但不記錄提交事件。 如何檢查輸入是否提交？

Question

我有一個提交輸入更改的表單。 如果提交發生，我已經在表單上添加了一個 onsubmit 事件來記錄。 但它沒有記錄我的提交。

這是我的代碼：

<label for="id_cover_picture">Upload Cover</label>
<form action="" method="get" id="change_cover_picture_form">
    <input type="file" name="cover_pic" id="id_cover_picture" style="display: none;">
</form>

這是我的 JS 代碼：

    <script>
        const change_cover_picture_form = document.getElementById('change_cover_picture_form');
        const form_cover_img = document.getElementById('id_cover_picture');

        form_cover_img.addEventListener('input', () => {
            console.log('input changed ...');
            // even if it reloads , there will be data on localStorage
            localStorage.setItem('input_change', 'input change ... cover image')
            change_cover_picture_form.submit();
        })

        change_cover_picture_form.onsubmit = () => {
            console.log('Form submitted ...');
            // even if it reloads , there will be data on localStorage
            localStorage.setItem('submit_cover', 'submitted ... cover image')
        }
    </script>

我正在記錄輸入更改並提交表單，但沒有記錄提交...

請糾正我，如何確認提交，以及為什么 onsubmit 不起作用。 我什至嘗試過addEventListener('submit')

預期答案：

記錄提交，並在提交發生時執行一些操作

Answer 1

沒有辦法提交表格。 向表單添加提交輸入，然后單擊它。