Question

如何在JQUERY上使用hide and show执行具有next和prev的div，每个具有不同的功能。我也希望最后一个Finish不回到第一个div

这是jsfiddle

我想在page1上按下下一个我加载ajax，但不知道在哪里使用该函数，然后在第2页，不同的函数，但在我的jsfiddle它是相同的所有

EDIT1

添加了代码，由Praveen提出

$(document).ready(function(){
    $(".divs div").each(function(e) {
        if (e != 0)
            $(this).hide();
    });

    $("#next").click(function(){
        if ($(".divs div:visible").next().length != 0)
            $(".divs div:visible").next().show().prev().hide();
        else {
            $(".divs div:visible").hide();
            $(".divs div:first").show();
        }
        return false;
    });

    $("#prev").click(function(){
        if ($(".divs div:visible").prev().length != 0)
            $(".divs div:visible").prev().show().next().hide();
        else {
            $(".divs div:visible").hide();
            $(".divs div:last").show();
        }
        return false;
    });
});

// I WANT TO CALL THESE
function page1()
{
    alert('page1');
  //call my function on page1
}

function page2()
{
    alert('new function');
}

HTML

<div class="divs">
    <div class="cls1">1</div>
    <div class="cls2">2</div>
    <div class="cls3">3</div>
    <div class="cls4">4</div>
</div>
<a id="next">next</a>
<a id="prev">prev</a>

Answer 1

您可以将您的功能保存在数组中，如下所示：

var funs = [
  function() {
     console.log('1 function');
  },
  function() {
     console.log('2 function');
  }
];

并在您的点击处理程序中调用此函数，如下所示：

var i = $(".divs div:visible").index();
funs[i] && funs[i]();

或

if (typeof funs[i] == 'function') {
    funs[i]();
}

或没有数组如：

if (i == 0) {
    page1();
} else if (i == 1) {
   page2();
}

具有不同功能的多个显示/隐藏div

1 个答案: