Question

我想在selectbox的onChange事件上进行表单提交。提交操作应该触发JQuery函数。当我使用提交按钮而不是onChange事件函数时，它工作正常。但是，当我使用onChange事件时，我无法触发该功能。

我的表格：

<form id="zoekSchool" method="get">   
    <div class="form-group">
        <label for="thema" class="desktop small">School</label>
        <select class="form-control" name="school" id="school" onchange="this.form.submit()">
            <option value="" disabled selected>Search</option>
            <option value="1">item 1</option>
            <option value="2">item 2</option>
            ... 
        </select>
    </div>
</form>

我的Javascript / Jquery：

function initMap(x) {
    $('#zoekSchool').submit(function() { // bind function to submit event of form
        var schoolID  = $('#school').val();
        ...
        return false; //prevent default action
    });
}

<script src="https://maps.googleapis.com/maps/api/js?key=myKey&callback=initMap"
    async defer></script>

其中......代表＆＃39;一些代码＆＃39;。

也许很重要：我正在使用googleMaps Api。这可能是什么问题？

Answer 1

你可以这样试试..

onchange="$(this).parents('form').submit()"

或

onchange="$('#zoekSchool').submit()"

而不是onchange="this.form.submit()"

<form id="zoekSchool" method="get">   
<div class="form-group">
    <label for="thema" class="desktop small">School</label>
    <select class="form-control" name="school" id="school" onchange="$('#zoekSchool').submit()">
        <option value="" disabled selected>Search</option>
        <option value="1">item 1</option>
        <option value="2">item 2</option>
        ... 
    </select>
</div>
</form>

Answer 2

在文档Ready中创建事件处理程序，使用以下代码

{{1}}

表单提交onChange事件确实与JQuery函数

2 个答案: