Question

我有一个带有scrollto 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; }

提前感谢您的思考！

Answer 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);
        }
    });
});

如何在下拉列表中调用2个jQuery函数？

1 个答案: