Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Обращение по классу (https://javascript.ru/forum/dom-window/50414-obrashhenie-po-klassu.html)

kostar 25.09.2014 13:59

Обращение по классу
 
Всем доброго времени суток) Ребята пролазил весь интернет все никак не могу найти решение подскажите пожалуйста вобщем есть изменяемый список в диве
<div id='one'>
    <span class='price'>text1</span>
    <span class='price'>text2</span>
    <span class='price'>text3</span>
    <span class='price'>text4</span>
    <span class='price'>text5</span>
</div>

<div id='two'>

</div>


мне нужно осуществить следущее : нажимаешь на определенный span и в диве ("#two") появлялась та надпись на которую ты нажал. (т.е. нажал на надпись text3 в диве номер два появилась надпись "text3")Задавать span-ам id нельзя т.к. число span-ов изменяеться их может быть 2 а может быть и 100. как то через классы надо. по id я знаю как выводить но так не устраивает. подскажите пожалуйста очень хочу так научиться:) Заранее всем спасибо)

ksa 25.09.2014 14:05

Цитата:

Сообщение от kostar
очень хочу так научиться

Вешай обработчик клика на те спаны... Вычитывай текст... Записывай его в нужный тебе элемент.
Вот собственно и вся "учеба". ;)

kostar 25.09.2014 14:09

я пытался данным способом:
<div id='one'>
    <span class='price'>text1</span>
    <span class='price'>text2</span>
    <span class='price'>text3</span>
    <span class='price'>text4</span>
    <span class='price'>text5</span>
</div>

<div id='two'>

</div>


$('.price').click(function (){

    var premen =  document.querySelector(".price").id;
    alert(premen);

});


Но он у меня почемуто выводит первый span a не тот на который я нажал

ksa 25.09.2014 15:21

Цитата:

Сообщение от kostar
я пытался

Немного не так... :)

<!DOCTYPE html>
<html>
<head>
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
</style>
<script type='text/javascript'>
$(function (){
	$('.price').click(function (){
		var premen =  this.innerHTML;
		$('#two').text(premen);
	});
});
</script>
</head>
<body>
<div id='one'>
    <span class='price'>text1</span>
    <span class='price'>text2</span>
    <span class='price'>text3</span>
    <span class='price'>text4</span>
    <span class='price'>text5</span>
</div>
<div id='two'></div>
</body>
</html>
</html>

kostar 25.09.2014 15:26

Круто все работает))))) Спасибо большое ты меня выручил)))


Часовой пояс GMT +3, время: 02:40.