Question

我想知道选择框是否可以有两个功能。

1.使用value选择选项时自动重定向。

2.使用data-file通过ajax将内容载入最近的div。

<select class="loadurl">
 <option value="#">Select</option>
 <option value="contact.php">Contact</option>
 <option value="about.php">About</option>
 <option data-file="fans.php">Fans</option>
</select>
<div class="area"></div>

但是当我尝试使用以下脚本时，ajax选项（Fans）不起作用，但尝试重定向。我可以知道如何在一个选择框中有两个功能吗？这是一个 demo 。

$(".loadurl").bind('change', function () {

  var selected = $(this).find('option:selected');
  var loadfile =selected.data('file');
  var area = $(".area");

  $(this).next(".area").load(loadfile);
area.empty();

});


$('.loadurl').bind('change', function () {
    window.location.href = $(this).val();
});

Answer 1

您需要在此处使用条件选择 - 如果所选选项具有data-file，则在area中加载目标，否则重新加载页面。

var area = $(".area");
$(".loadurl").on('change', function () {
    var selected = $(this).find('option:selected');
    var loadfile = selected.data('file');
    if (loadfile) {
        area.empty();
        $(this).next('.area').load(loadfile);
    } else {
        window.location.href = $(this).val();
    }
});

一个选择框，在jQuery中有两个函数

1 个答案: