Форум

Broken · #1 (**permalink**) 19.08.2012, 05:27

Сразу извиняюсь если вопрос глупый.

Суть такая, есть несколько элементов, например span, с одинаковыми атрибутами class и разными id, причем все это дело формируется динамически:

<span class="navigatorItem" id="id_0"></span>
<span class="navigatorItem" id="id_1"></span>
<span class="navigatorItem" id="id_2"></span>

Мне надо зная класс поймать id, нашел множество вариантов, но не один работать не стал, например такое решение:

$('.navigatorItem').live('click', function() {
         var id_click =   console.log(event.target.id);
         alert(id_click);
        });

Вернуло: undefined

Может, кто знает как, заранее спасибо)

vadim5june · #2 (**permalink**) 19.08.2012, 08:38

а если так

$('.navigatorItem').live('click', function(e) {
         var id_click =   e.target.id;
         alert(id_click);
        });

bot87 · #3 (**permalink**) 19.08.2012, 09:31

<style>
span{border:1px solid red;padding:0 30px}
</style>
</head>

<body>
<div id="tar">
<span class="navigatorItem" id="id_0"></span>
<span class="navigatorItem" id="id_1"></span>
<span class="navigatorItem" id="id_2"></span>
 </div>
<script>  
document.getElementById('tar').onclick=function fn(e){
e = e || event
var target = e.target || e.srcElement
alert('click:'+target.id)
	}


</script>

http://learn.javascript.ru/bubbling-and-capturing

Deff · #4 (**permalink**) 19.08.2012, 10:18

<script type="text/javascript" src="http://yandex.st/jquery/1.7.2/jquery.min.js"></script>


<span class="navigatorItem" id="id_0">aaa</span> 
<span class="navigatorItem" id="id_1">bbb</span> 
<span class="navigatorItem" id="id_2">ccc</span>

<script type="text/javascript">
$('.navigatorItem').live('click', function() {
         alert($(this).attr("id"));
});
</script>

Magneto · #5 (**permalink**) 19.08.2012, 12:54

с версии JQuery 1.7 вместо live нужно использовать on

Broken · #6 (**permalink**) 19.08.2012, 16:43

vadim5june, bot87, Deff большое спасибо, все работает))

Magneto спасибо, но есть проблема, у меня этот скрипт должен несколько раз повторяться на странице, если использовать “on”, то последний из повторов не работает и к тому же если вручную прописать например вот так:

//navId = "id",
$('#'+ options.navId+'_0').on('click',function(){
     //не работает
  });

работать не будет, в отличие от live.

melky · #7 (**permalink**) 19.08.2012, 17:30

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

vadim5june, bot87, Deff большое спасибо, все работает))

Magneto спасибо, но есть проблема, у меня этот скрипт должен несколько раз повторяться на странице, если использовать “on”, то последний из повторов не работает и к тому же если вручную прописать например вот так:

//navId = "id",
$('#'+ options.navId+'_0').on('click',function(){
     //не работает
  });

работать не будет, в отличие от live.

Вы не поняли, live в JQ 1.7 вызывает on. зачем Вам один бесполезный вызов в виде live?

в данном случае:

//navId = "id",
$(document.body).on('click', '#'+ options.navId+'_0', function(){
     // оливье
});

Broken · #8 (**permalink**) 19.08.2012, 18:16

2melky, большое спасибо)

Broken · #9 (**permalink**) 20.08.2012, 05:09

Чтобы не создавать новую тему еще один глупый вопрос, как правильно писать функции в jquery скриптах, обычно я писал вот так:

function someFunction () {
	 //Работает
	}

И не обращал внимания, но тут ковыряя разный чужой код, натолкнулся вот на такую запись:

someFunction = function () {
	 //Не работает с несколькими вызовами
	}

Она работает, только если я вызываю скрипт на странице один раз, если использую несколько раз, работает только последний вызов.

А вот так опять все нормально:

var someFunction = function () {
	 //Работает
	}

Буду очень благодарен, если кто-нибудь объяснит)

Форум

Справочник

Discord чат

Курсы javascript