Плагин jQuery Switch Case? - PullRequest
       26

Плагин jQuery Switch Case?

3 голосов
/ 24 октября 2009

Я знаю, что инструкция переключения регистра свойственна javascript, и вы не можете ее изменить. Я все еще изучаю javascript и jQuery, поэтому я могу обойтись, но я не знаю достаточно, чтобы написать что-то, что может быть на уровне самого jQuery. Итак, примите это как идею или вопрос о том, возможна ли эта идея.

Это моя идея, оператор switch case, который может использовать объекты ... который может быть использован примерно так:

switch( $(this) ){

 case .hasClass('foo'):
  // do something
  break;

 case .filter('.bar').attr('id') == 'foo':
  // do something else
  break;

}

Редактировать: Даже что-то вроде этого было бы неплохо (возможно, более разумная идея) ...

switch ($(this).hasClass()) {

 case 'foo':
  alert('found a foo!');
  break;

 case 'bar':
  alert('found a bar!');
  break;

}

Ответы [ 5 ]

3 голосов
/ 05 декабря 2009

Часто переключатели - не лучший способ решения проблемы, но используя jQuery, вы можете создать плагин, который работает как оператор switch:

(function($) {
    $.fn.switchClasses = function(switches) {
        return this.each(function() {
            var that = this;
            $.each(this.attr("class").split(' '), function(i, class) {
                var func = switches[class];
                if(func)
                    func.apply(that, class);
            });
        });
    };
})(jQuery);

Вы бы использовали плагин так:

$(this).switchClasses(
    {
        "class1":
        function(class) {
            // Do something for this class, 
            // the "this" variable is the jquery object that matched the class
        },

        "class2":
        function(class) {

        }
    }
);
1 голос
/ 19 мая 2011

Во-первых, оператор switch работает только для int. Я не уверен, почему javascript сохранил это ограничение от C / C ++, но он есть.

Использование вложенных блоков if-then-else вместо переключателя может привести к крайне нечитаемому коду, если вы имеете дело с более чем несколькими опциями.

Однако, как и в C и C ++, есть обходные пути, и этот включает использование «break» как goto, которые не всегда являются злом. Это ситуация (большое количество вложенных if-the-else), когда goto сделает код более эффективным и читабельным. В C / C ++ вы бы реализовали это, используя goto с меткой, находящейся в конце серии if (где теперь находится конец скобки переключателя), и пропускали переход в контекст переключателя.

switch (1) { //yes, that is a hardcoded 1, we only want the switch block for the break keyword
    if (yourString == "Case 1") {
        do_stuff_1();
        break; // well, we're done, let's get out of here.
    }

//implicit else - if you matched the first one, you'd be out of here

    if (yourString == "Case 2") {
        do_stuff_2();
        break; // well, we're done, let's get out of here.
    }

    // etc.....

    default:
        do_error_condition();
} //end of switch
0 голосов
/ 01 февраля 2012
    (function($) {
    $.fn.switchClasses = function(switches) {
        return this.each(function() {
            var that = this;
            $.each(this.attr("class").split(' '), function(i, classname) {
                var func = switches[classname];
                if(func){
                    func.apply(that, classname);
                }
            });
        });
    };
})(jQuery);

'class' - это зарезервированное имя, и я добавил несколько пропущенных скобок

0 голосов
/ 11 декабря 2009

Вы можете включить element.attr('class'), если имеете дело с одним именем класса.

Если вы имеете дело с более чем одним, вы можете сделать element.attr('class').split(/\s+/) и проверить имя класса в этом массиве.

Я также думаю, что вы можете взглянуть на .is(). Вы можете делать такие вещи, как if( element.is('a.foo') ) console.log( 'This is a link with a 'foo' class.' );

Возможно, вы захотите изменить свой подход. Я не вижу, чтобы это был самый эффективный способ сделать то, что вы пытаетесь сделать.

0 голосов
/ 24 октября 2009

Что не так с нормальным if/else?

inst = $(this);

if (inst.hasClass('foo')) {
    // do something
} else if (inst.filter('.bar').attr('id') == 'foo') {
    // do something else
}
...