Блог

У меня это почти работает, но я схожу с ума от jQuery (я не очень хорош в этом, но учусь)

Вот скрипка: http://jsfiddle.net/5CRA5/4 /

Поскольку я не могу показать вам выпадающий список из динамически созданного post-запроса, я создал кнопку поиска под кнопками операций и настроек, которые вы можете нажать, которые были бы в раскрывающемся списке div.

Все работает отлично, за исключением того, что когда или если у кого-то было меню настроек, и они затем нажали на операции. Это просто уберет меню, а не разместит новое. Я думал, что у меня правильный код, но он работает не так. Должно быть, я чего-то не хватает. Все остальные меню отлично работают в том смысле, что они удаляются и помещают нужное.

Кроме того, есть ли способ сделать так, чтобы сообщение не появлялось до тех пор, пока div не будет полностью запущен? Так что, когда вы возвращаете его обратно, оно кажется бесшовным. Я обнаружил, что так оно и есть сейчас. Иногда вы можете увидеть, как он заменяет информацию перед ее запуском.

Ниже приведен код jQuery для тех, кто может просто взглянуть на него и увидеть, что я делаю неправильно.

         function menuCall(div_id, bottom, filename) {
            $('[id^="menu_"]').animate({"top": "-50px"}, "slow");
            $('[id^="menu_"]').delay(500).queue( function(next){$(this).hide();next();});

            $.post("/opserv/"   filename, function(ajaxresult){
                $('#' div_id).html(ajaxresult);
            });

            if ($('#' div_id).css('top') !== bottom   'px') {
                $('#' div_id).queue( function(next){$(this).show();next();});
                $('#' div_id).animate({"top": " "   bottom   "px"}, "slow");
            } else {
                $('#' div_id).animate({"top": "-50px"}, "slow");
                $('#' div_id).delay(500).queue( function(next){$(this).hide();next();});
            }
        }
  

Я полагаю, что это происходит потому, что вы ссылаетесь на один и тот же раздел — обе кнопки Operations и Settings указывают на menu_panel-2, что заставляет div переключаться, поскольку он действует, когда вы дважды нажимаете Settings или Operations дважды (чтобы показать и скрыть меню). Итак, вам нужно сначала найти способ сообщить функции, какая кнопка нажата — будь то Настройки или операции. Я сделал это, просто добавив новую переменную в функцию -> «тип». Затем вам нужно проверить, является ли тип «Ops» для операций или «Set» для «настроек». Затем, если это один из них, вы просто показываете div. Обратите внимание, что это не позволит вам скрыть меню операций или настроек после открытия, единственный способ скрыть его — переключиться на поиск, а затем снова нажать поиск. Итак, вам нужно проверить, какая кнопка нажата последней, просто добавив переменную, чтобы сохранить ее для вас, затем вы сравниваете ее с «типом».

http://jsfiddle.net/5CRA5/12/

    var check = ''
function menuCall(div_id, bottom, filename,type) {
    $('[id^="menu_"]').animate({"top": "-50px"}, "slow");
    $('[id^="menu_"]').delay(500).queue( function(next){$(this).hide();next();});

    $.post("/opserv/"   filename, function(ajaxresult){
        $('#' div_id).html(ajaxresult);
    });

    if ($('#' div_id).css('top') != bottom   'px') {
        $('#' div_id).queue( function(next){$(this).show();next();});
        $('#' div_id).animate({"top": " "   bottom   "px"}, "slow");
    } else {
        if(type=='Ops' || type =='Set'){
            if (check == type){
               $('#' div_id).animate({"top": "-50px"}, "slow");
            $('#' div_id).delay(500).queue( function(next){$(this).hide();next();}); 
            }
            else{
            $('#' div_id).queue( function(next){$(this).show();next();});
            $('#' div_id).animate({"top": " "   bottom   "px"}, "slow");
            } 
        }
        else{
        $('#' div_id).animate({"top": "-50px"}, "slow");
        $('#' div_id).delay(500).queue( function(next){$(this).hide();next();});
        }

    }
    check = type;
}
  

Надеюсь, это поможет.