Форум

moloko · #1 (**permalink**) 29.07.2013, 20:02

Есть ссылка

<a href="javascript:void(0);" class="link cityselect__link" onclick=".....">город</a>

Есть javascript файл

var ad = {

    init: function() {
        this.bindEvents();
    },


    bindEvents: function() {
        var _this = this;

        // cityselect
        $('#cityselect .cityselect__link').bind('click', _this.toggleCityselect);
    },

    toggleCityselect: function(e, state) {
        var pageWrapper = $('#page'),
            cityselect = $('#cityselect');

        if (e) {
            e.preventDefault();
        }
        if (cityselect.hasClass('cityselect_shown') || state === 'hide') {
            // hide
            cityselect.removeClass('cityselect_shown');
            $('body').unbind('click', ad.cityselectBodyClickHandler);
            $(window).unbind('keydown', ad.windowKeydownHandler);
        } else if (!cityselect.hasClass('cityselect_shown') || state === 'show') {
            // show
            cityselect.addClass('cityselect_shown');
            $('body').bind('click', ad.cityselectBodyClickHandler);
            $(window).bind('keydown', ad.windowKeydownHandler);
        }
    },


    cityselectBodyClickHandler: function(e) {
        if (!$(e.target).closest('.cityselect__title').length) {
            ad.toggleCityselect();
        }
    },

    windowKeydownHandler: function(e) {
        if (e.which === 27) {
            ad.toggleCityselect(null, 'hide');
            $(window).unbind('keydown', this.windowKeydownHandler);
        }
    }
};

$(document).ready(function() {
    ad.init();
});

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

skrudjmakdak · #2 (**permalink**) 29.07.2013, 20:17

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
	<html>
		<head>
		</head>
	<body>
	<a href="http://google.ru" onclick="return clk();">кликай меня полностью :)</a>
	<script>
	function clk()
		{
		alert('меня кликнули!');
		return false;
		}
	</script>
	</body>
</html>

skrudjmakdak · #3 (**permalink**) 29.07.2013, 20:22

а селектор находит?
попробуйте в консоль вывести:
console.log($('#cityselect .cityselect__link')[0]);

moloko · #4 (**permalink**) 29.07.2013, 20:30

Сообщение от skrudjmakdak

а селектор находит?
попробуйте в консоль вывести:
console.log($('#cityselect .cityselect__link')[0]);

А как это вывести в консоль?

skrudjmakdak · #5 (**permalink**) 29.07.2013, 20:36

и там это имхо не нужно:
href="javascript:void(0);"

Про консоль. чтобы посмотреть в консоль, то это зависит от браузера. называется фаербаг(отладчик), необходим для нахождения ошибок. например в хроме он установлен по умолчанию и вызывается f12. в фаерфокс нужно скачать и установить.

после того как вызвали отладчик, там есть вкладка консоль.. туда быдут сыпаться все сообщения (и ошибки тоже).

теперь пишем:

...
bindEvents: function() {
        var _this = this;
        // cityselect
	console.log($('#cityselect .cityselect__link')[0]);
        $('#cityselect .cityselect__link').bind('click', _this.toggleCityselect);
    },
...

если код дойдет до этой строчки: console.log($('#cityselect .cityselect__link')[0]);
то в консоль упадет сообщение. и должен отобразиться там объект. если будет undefined то объект не найден.

moloko · #6 (**permalink**) 29.07.2013, 20:47

В консоле показало:
Uncaught ReferenceError: $ is not defined cityselect.js:50

т.е. как я поняла он его находит, но не определяет, верно?

skrudjmakdak · #7 (**permalink**) 29.07.2013, 20:55

на 50й строчке ошибка. мм а у вас jquery библиотека подключена. он на нее ругается. что то на подобии должно быть:
<script type="text/javascript" src="http://code.jquery.com/jquery-1.10.2.min.js"></script>

вообще в src может и другой адрес быть прописан.. если нет вообще такого подобного вставьте эту строчку

moloko · #8 (**permalink**) 29.07.2013, 21:09

Нет, не помогает...

skrudjmakdak · #9 (**permalink**) 29.07.2013, 21:22

покажите 50ю строчку.. плюс минус строк 8

moloko · #10 (**permalink**) 29.07.2013, 21:54

windowKeydownHandler: function(e) {
        if (e.which === 27) {
            ad.toggleCityselect(null, 'hide');
            $(window).unbind('keydown', this.windowKeydownHandler);
        }
    }
};

№50    $(document).ready(function() {
    ad.init();
});

Это совсем в конце получается.

Форум

Справочник

Discord чат

Курсы javascript