Question

In Optimizely, I'm trying to do some basic click events. I know that Optimizely is only on jquery 1.6, so using on(), off() for events is useless. To make sure, I'm using the most basic event handler click(function(){ ... }));, but even this is not working. I was told to use window.$ but in the click() this technique doesn't work either. Is the jquery in Optimizely different?

I know there is some kind of issue between Optimizely and jQuery but please can someone shed me some light on this?

JS snippett:

(function(window.$) {

  window.$.fn.tabbs = function(options) {
    var settings = {
            dir: 'top',
            trigger: 'a',
            target: '.tab-section',
            selected: 'selected'
        },
        html = $('html');

    window.alert('jquery object: ' + window.$);

    if (html.hasClass('no-js')) {
        html.removeClass('no-js').addClass('js');
    } else {
        html.addClass('js');
    }

    var classAction = function(obj, action, cls) {
        window.$(obj)[action](cls);
    };

    window.$.extend(settings, options);

    return this.each(function() {
        var tabs = window.$(this),
            tab = tabs.find(settings.trigger),
            tabSection = window.$(settings.target),
            tabsSystemContainer = tabs.closest('div');

        switch(settings.dir) {
            case 'left':
                tabsSystemContainer.removeClass(settings.dir || 'top').addClass('left' || settings.dir);
                break;
            default:
                tabsSystemContainer.removeClass('left' || settings.dir).addClass(settings.dir || 'top');
        }
        //this where I'm having problems
        tab.click(function(e) {
            var self = window.$(this);

            e.preventDefault();

            window.alert('Hello, inside tab click event...');
        });
    });
  };
}(window.jQuery));

window.$('.tabs').tabbs();

Many Thnaks

Was it helpful?

Solution

You have a syntax error on line 1:

(function(window.$) {

should read

(function($) {

You can use whichever jQuery (>= 1.6) you like: just embed the one you want, and in Optimizely's Settings -> jQuery Settings, select "Do not include jQuery in project code", and things will work just fine. Be sure you include your own jQuery before the Optimizely script tag, though.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top