0

メニュー変更コンテンツ領域をクリックします。「menu2」または「menu3」をクリックした場合、「次へ」ボタンが機能しません。 

// Menu click 
$(".nav ul li a").click(function () {
    var x= $(this).parent().attr('id');
    $('.tbClass').removeClass('pTabActive');
    $('#c'+x).addClass('pTabActive');
    $('.nav ul li').removeClass('mActive');
    $(this).parent().addClass('mActive');
    //location.hash = $(this).attr('href'); /* URL Parametre Location */                          
});

// Navigation Click
$(".btnNext").click(function () {
    var x= $('.nav ul li').attr('class');
    var $item=$('.nav ul li.'+x);
    var $index=$('.nav ul li').index($item); // selected menu index
    alert($index);
});

フィドル： http： //jsfiddle.net/Ertbihal/kBuCe/13/

どうすればそれを機能させることができますか？

4

4 に答える 4

0

試す

// Menu click 
var menuItems = $(".nav ul li a").click(function () {
    var x = $(this).parent().attr('id');
    $('.tbClass').removeClass('pTabActive');
    $('#c' + x).addClass('pTabActive');
    $('.nav ul li').removeClass('mActive');
    $(this).parent().addClass('mActive');
    //location.hash = $(this).attr('href'); /* URL Parametre Location */                          
});

// Navigation Click
$(".btnNext").click(function () {
    var $item = $('.nav ul li.mActive');
    var $index = $('.nav ul li').index($item); // selected menu index
    if ($index < menuItems.length-1){
        menuItems[$index+1].click();
    }
});

$(".btnPrevious").click(function () {
    var $item = $('.nav ul li.mActive');
    var $index = $('.nav ul li').index($item); // selected menu index
    if ($index > 0){
        menuItems[$index-1].click();
    }
});

http://jsfiddle.net/gaby/kBuCe/15/でのデモ

于 2013-02-08T12:23:56.163 に答える
0

まず、クラスまたは ID に数値を追加しないでください。クラスを正しく参照していません。

以下のコードは常に表示されますmActive:

    var x= $('.nav ul li').attr('class');

作業コード:

// Navigation Click
$(".btnNext").click(function () {
    if ($(".mActive").next().length)
    {
        a = $(".mActive");
        a.removeClass("mActive");
        a.next().addClass("mActive");
        b = $(".pTabActive");
        b.removeClass("pTabActive");
        b.next().addClass("pTabActive");
    }
});

$(".btnPrevious").click(function () {
    if ($(".mActive").prev().length)
    {
        a = $(".mActive");
        a.removeClass("mActive");
        a.prev().addClass("mActive");
        b = $(".pTabActive");
        b.removeClass("pTabActive");
        b.pre().addClass("pTabActive");
    }
});

フィドル: http://jsfiddle.net/kBuCe/17/

于 2013-02-08T12:18:11.297 に答える
0

このようにしてみてください

var x= $('.mActive').attr('id');
var $index=$('.nav ul li').index($("#"+x));
alert($index);

デモを見る

于 2013-02-08T12:19:33.230 に答える
0

これはあなたにぴったりだと思います：

// Menu click 
$(".nav ul li a").click(function () {
  $(this).parent().addClass('mActive').siblings().removeAttr('class');    
  $('#c'+$(this).parent().attr('id')).addClass('pTabActive').siblings().removeClass('pTabActive');  
});

// Navigation Click
$(".btnNext").click(function () {        
  var _index=$('.nav ul li.mActive').index() + 1;
  if(_index <= $('.nav ul li').length)
    $('.nav ul li').eq(_index).find('a').click();   
});

$(".btnPrevious").click(function () {
   var _index=$('.nav ul li.mActive').index() - 1;
   if(_index >= 0)
    $('.nav ul li').eq(_index).find('a').click();   

});

デモ: http://jsfiddle.net/ducwidget/kBuCe/18/

于 2013-02-08T12:58:56.503 に答える