当 html 选择表单发生变化时，弹出警报然后发送表单答案

【问题标题】：When html select form changes, pop up alert then send form当 html 选择表单发生变化时，弹出警报然后发送表单
【发布时间】：2014-03-08 22:37:34
【问题描述】：

我在表单中的选择上使用 onchange="this.form.submit()"，它按预期工作，但是我希望在您更改选择下拉菜单时弹出一个警报，然后让如果单击确定，则提交表单。如果有人有办法做到这一点，如果你能分享它，将不胜感激。 -谢谢

<form action="/index.php/dashboard/pages/page_statistics/change_collection_type/" method="post">
    <input type="hidden" value="690" name="cID">
    <select onchange="this.form.submit()" name="ctID">
    <option value="4">Blog Entry</option>
    <option value="85" selected="selected">Blog Posting</option>
    <option value="5">Full</option>
    </select>
</form>

【问题讨论】：

标签： javascript forms

【解决方案1】：

使用确认功能。就像警报一样工作，但如果用户按下确定则返回 true，如果按下取消则返回 false。

test = confirm("Continue?");

if (test) {
    this.form.submit()
}

所以对你来说，你应该把它放在你的 onchange 上

onchange="if(confirm('Continue?')){this.form.submit()}"

【讨论】：

【解决方案2】：

应该这样做：

...
<select onchange="submitForm(this.form);" name="ctID">
...

然后在你的函数中：

function submitForm(form){
    if(confirm('Are you sure you want to submit this form?')){
        form.submit();
    } else {
        return false;
    }
}

这是一个超级基本的例子，但应该传达要做什么的概念。

附带说明，您确实应该将此调用外部化，将 HTML 与 Javascript 分开。这将使每个都更易于维护，以及潜在的可重用性。一个例子是这样的：

...
<select id="submitFormSelect" name="ctID">
...

然后在你的外部 JS 中：

window.onload = function(){
    var form = document.getElementById('submitFormSelect');

    function submitForm(){
        if(confirm('Are you sure you want to submit this form?')){
            form.submit();
        } else {
            return false;
        }
    }

    if(form.addEventListener) {
        form.addEventListener('change',submitForm,false);
    } else if(form.attachEvent) {
        form.attachEvent('onchange',submitForm); 
    }
}

又是一个非常基本的实现，但应该传达整体概念。

【讨论】：