如何在下拉列表更改时调用 2 个 jQuery 函数？答案

【问题标题】：How to call 2 jQuery functions on change in dropdownlist?如何在下拉列表更改时调用 2 个 jQuery 函数？
【发布时间】：2014-04-09 23:01:30
【问题描述】：

我有一个带有滚动到 jQuery onchange 的简单下拉列表（它会将您带到网站上的特定位置）。如果单击列表中的一个特定选择，我想在 jQuery 中调用一个更改函数，该函数将显示一个隐藏的 div 元素（并在之后进行其他选择时再次隐藏它）。我设法让他们分开工作，但不能一起工作。是否可以让这两个功能在同一个下拉列表中工作？我对此很陌生。

我的代码部分如下：

<select id="dropdownlist">
<option value="one">Scroll to place 1</option>
<option value="two">Scroll to place 2</option>
<option value="three">Show hidden div</option>
</select>

scollto jQuery：

<script>
$(document).ready(function(){
$("#dropdownlist").on('change',function(){
var project = "#" + $(this).val();
$.scrollTo($(project), 1100);
});
});
</script>

显示/隐藏 jQuery（在这个例子中看到：http://www.tutorialrepublic.com/codelab.php?topic=faq&file=jquery-show-hide-div-using-selectbox）：

<script type="text/javascript" src="http://code.jquery.com/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("select").change(function(){
$( "select option:selected").each(function(){
if($(this).attr("value")=="three"){
$(".box").hide();
$(".three").show();
}
});
}).change();
});
</script>

CSS：

.box { display: none; }
.three{ background: #FFF; }

提前感谢您的考虑！

【问题讨论】：

将操作分成两个函数，并在您的onchange 中根据选择.val() 调用其中一个或另一个。
谢谢鹅的回复。听起来合乎逻辑，但这就是我正在努力解决的问题，因为我是 jQuery 新手（以前从未使用过它）。你能帮我写出来吗？

标签： jquery function onchange html.dropdownlistfor

【解决方案1】：

我最初说：将操作分成两个函数并根据下拉列表的选择从 onchange 调用函数 - 但如果您不重用它们，您甚至不需要这样做，只需在 onchange 中包含 if 语句以完成所需的操作：

$(document).ready(function(){
    $("#dropdownlist").on('change',function(){
        if ($(this).val() == "three") {
            $(".box").hide();
            $(".three").show();
        } else {
            var project = "#" + $(this).val();
            $.scrollTo($(project), 1100);
        }
    });
});

【讨论】：