javascript - CoDrops 下拉菜单 onChange 事件不起作用

Question

我正在集成 one的these dropdown effects到我的项目。我想列出一个国家/地区列表，当访问者选择一个国家/地区时，它会将他/她发送到一个页面。问题是，当 dropdown.js 混合在一起时，onChange() 事件将不起作用。

我尝试过

onChange='this.form.submit()"

还有

onChange='sendForm()"
...
<script type="text/javascript">
function sendForm() {
    document.getElementById("destination-select").submit();
}
</script>

如果我删除 dropdown.js，两者都会起作用，但显然效果会丢失。

表格是

<form id="destination-select" action="/" method="get">
    <select name="destination" id="cd-dropdown" class="cd-select" onchange="sendForm()">
         <option value="-1" selected>Destination</option>
         <option value="argentina" class="icon-argentina">Argentina</option>
         <option value="brazil" class="icon-brazil">Brazil</option>
         <option value="spain" class="icon-spain">Spain</option>
         <option value="more " class="icon-more">See more</option>
    </select>
</form>

更新

如@Amit指出，有一个 onOptionSelect() 方法，我使用它并查找，有效。问题是它没有检索所选选项。 onChange="sendForm()"和 onChange="this.form.submit()"都不会。我什至尝试用 .click() 方法伪造一个点击按钮。有任何想法吗？谢谢!

一些代码:

<form id="destination-select" action="/" method="get">
    <select name="destination" id="cd-dropdown" class="cd-select" >
        <option value="-1" selected disabled>Destination</option>
        <option value="argentina" class="icon-argentina">Argentina</option>
        <option value="brazil" class="icon-brazil">Brazil</option>
        <option value="spain" class="icon-spain">Spain</option>
        <option value="more" class="icon-more">See more</option>
    </select>
</form>

Javascript:

$( function() {
    $( '#cd-dropdown' ).dropdown({
        gutter : 5,
        delay : 100,
        random : true,
        onOptionSelect: function(opt){
            sendForm();
        }
    });
});

sendForm()

function sendForm() {
            document.getElementById('destination-select').submit();
        }

结果始终是:url.dev/?destination=-1

Answer 1

确保在 html 之前定义了 sendForm() 函数。如果这没有帮助尝试这个，

您正在使用的 jquery 下拉插件有一个配置参数“onOptionSelect”。您可以将一个函数传递给此参数，该参数将接收所选选项作为参数。

$("#cd-dropdown").dropdown(
    onOptionSelect: function(opt){
        // you can call your sendForm() here
    }
);