Грамотное написание кода

[blacklool]

Здравствуйте,

не первый день пишу на js, и вот хочу знать как правильно писать js код (а именно jquery) когда на сайте встроена подгрудка страниц и контента через POST и нужно прописывать клики по классам.

Вот пример, есть меню что обновляется пост запросами, но не полностью а частями, мне нужно по классам прописать евенты (клик),

вот мне говорили что нужно прописывать ид и по ним ставить клики, другие по классам, третье прописывать onclick....

как правильно прописывать эти евенты чтобы не было несколько "вызовов" при одном клике, да и вообще как это лучше всего делать?

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

спасибо!

[caetus]

я б делал как-то так !
Если у тебя например элементы которые вызывают события не в одном родительском блоке тогда вешай по классам !

<div id="div">
<p data-id="id1"></p>
<p data-id="id2"></p>
<p data-id="id3"></p>
</div>
<script>

$('#div').click(function (e) {
	var data = e.target.getAttribute('data-id');
	if(!data) return;
	alert(data) //$.get("index.php", data, myCallback,"json");
});
</script>

[blacklool]

<div id="div">
<p data-id="id1"></p>
<p data-id="id2"></p>
<p data-id="id3"></p>
</div>
<script>

$('#div').click(function (e) {
	var data = e.target.getAttribute('data-id');
	if(!data) return;
	alert(data) //$.get("index.php", data, myCallback,"json");
});
</script>

Привет!

интересно
такой вариант возможно доработать, и будет все именно так как мне нужно!

спасибо!

[Deff]

blacklool,
Наверно стоит уникальные ID ставить самим секциям подгрузки, тогда внутри можно разбивать по тем же классам или ID для схожих элементов по стилю, дабы не увеличивать лишних сущностей.
Тогда стиль будет примерно один для схожих секций перечислению селекторов с добавкой селектора секций подгрузки
типа:
#sect1 a, #sect2 a,#sect3 a {
Или
#sect1 .meny2, #sect2 .meny2,#sect3 .meny2{

[blacklool]

blacklool,
Наверно стоит уникальные ID ставить самим секциям подгрузки, тогда внутри можно разбивать по тем же классам или ID для схожих элементов по стилю, дабы не увеличивать лишних сущностей.
Тогда стиль будет примерно один для схожих секций перечислению селекторов с добавкой селектора секций подгрузки
типа:
#sect1 a, #sect2 a,#sect3 a {
Или
#sect1 .meny2, #sect2 .meny2,#sect3 .meny2{

Привет, да в принципе можно делать и так

я вот до сих пор как то так добавлял евенты после каждой подгрудки, просто вызывал функцию

$('a:not(.worked)')
	.addClass('worked')
	.click(function(e){
		if ($(this).hasClass('worked')) {
			e.preventDefault()
			content_load(this.href)
		}
	})

[tsigel]

blacklool,
Поробуйте с помощью делегирования:

$(document).on('click', 'a.to-load', function(e){
	e.preventDefault()
	content_load(this.href)
});

Создает один обоаботчик на документе и будет слушать клик по 'a.to-load', в не зависимости от того когда он появился в DOM.
https://learn.javascript.ru/event-delegation

[blacklool]

$(document).on('click', 'a.to-load', function(e){
	e.preventDefault()
	content_load(this.href)
});

ооо так еще лучше!
прочитал статью, разобрался, теперь не забуду
спасибо!

[tsigel]

Там вообще много полезного. Полазийте там.
https://learn.javascript.ru/animation
https://learn.javascript.ru/drag-and-drop