Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 03.04.2015, 17:57
Аспирант
Отправить личное сообщение для Trues Посмотреть профиль Найти все сообщения от Trues
 
Регистрация: 19.02.2015
Сообщений: 71

Скрыть дочерний див
Всем доброго времени суток)Не могу разобраться подскажи пожалуйста

есть парочку блоков

<div class='one-vybor activ-vybor'>
	<div class='img-vybor'><img src='img/vibor-pol.jpg' alt=''></div>
	<div class='img-vybor active-img'><img src='img/vibor-pol-activ.jpg' alt=''></div>
</div>
<div class='one-vybor'>
	<div class='img-vybor'><img src='img/vibor-voskl.jpg' alt=''></div>
	<div class='img-vybor active-img'><img src='img/vibor-voskl-activ.jpg' alt=''></div>
</div>
<div class='one-vybor'>
	<div class='img-vybor'><img src='img/vibor-job.jpg' alt=''></div>
	<div class='img-vybor active-img'><img src='img/vibor-job-activ.jpg' alt=''></div>
</div>


мне нужно при нажатии на див с классом 'one-vybor' в этом диве скрывался див с классом 'img-vybor' и появлялся див с классом 'img-vybor active-img' а у дива с классоми 'one-vybor activ-vybor' скрывался див с классом 'img-vybor active-img' и появлялся див с классом 'img-vybor'
так же надо чтобы на ди который мы нажали (one-vybor) добавлялся класс 'activ-vybor' а у которого был класс activ-vybor наоборот удалялся

сделал следущим образом
$(document).ready(function(){
	$('.one-vybor').click(function(){
		$('.one-vybor').removeClass('activ-vybor');
		$(this).addClass('activ-vybor');
	});
});

этот код работает а ответ на первый вопрос я так и не нашел(

уже перепробывал массу методов но допереть все никак немогу все рядом но не так получается то все скроются то вобще не работает(((

Ребят очень прошу о помощи

Последний раз редактировалось Trues, 03.04.2015 в 18:05.
Ответить с цитированием
  #2 (permalink)  
Старый 03.04.2015, 18:16
Аватар для Safort
Профессор
Отправить личное сообщение для Safort Посмотреть профиль Найти все сообщения от Safort
 
Регистрация: 23.12.2013
Сообщений: 1,856

В jQuery есть метод .children() он как раз тебе и нужен, если я правильно понял вопрос.
Ответить с цитированием
  #3 (permalink)  
Старый 03.04.2015, 19:08
Аватар для рони
Профессор
Отправить личное сообщение для рони Посмотреть профиль Найти все сообщения от рони
 
Регистрация: 27.05.2010
Сообщений: 33,078

Открывашка 207
Trues,

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
   .one-vybor.activ-vybor .img-vybor:last-child, .one-vybor .img-vybor:first-child{
    display: block;
  }
  .one-vybor.activ-vybor .img-vybor:first-child, .one-vybor .img-vybor:last-child{
    display: none;
  }

  </style>
  <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script>
     $(function(){
       var s = $(".one-vybor");
       s.click(function() {
         s.not(this).removeClass("activ-vybor");
         $(this).toggleClass("activ-vybor");
      });
});


  </script>
</head>


<body>
<div class='one-vybor activ-vybor'>
	<div class='img-vybor'><img src='http://javascript.ru/forum/images/smilies/write.gif' alt=''></div>
	<div class='img-vybor '><img src='http://javascript.ru/forum/images/smilies/victory.gif' alt=''></div>
</div>
<div class='one-vybor'>
	<div class='img-vybor'><img src='http://javascript.ru/forum/images/smilies/write.gif' alt=''></div>
	<div class='img-vybor '><img src='http://javascript.ru/forum/images/smilies/victory.gif' alt=''></div>
</div>
<div class='one-vybor'>
	<div class='img-vybor'><img src='http://javascript.ru/forum/images/smilies/write.gif' alt=''></div>
	<div class='img-vybor '><img src='http://javascript.ru/forum/images/smilies/victory.gif' alt=''></div>
</div>

</body>

</html>
Ответить с цитированием
  #4 (permalink)  
Старый 06.04.2015, 12:51
Аспирант
Отправить личное сообщение для Trues Посмотреть профиль Найти все сообщения от Trues
 
Регистрация: 19.02.2015
Сообщений: 71

немного не то( но информация оказалась полезной спасибо)) но мало что от туда понял(
Ответить с цитированием
  #5 (permalink)  
Старый 06.04.2015, 12:55
Аспирант
Отправить личное сообщение для Trues Посмотреть профиль Найти все сообщения от Trues
 
Регистрация: 19.02.2015
Сообщений: 71

Ребят допустим я нажал на див в нем пару дочерних дивов и как можно к ним обратится? при событии клика на родительский див

например

<div class='one'>
    <div class='two'></div>
    <div class='two_all'></div>
</div>

<div class='one'>
    <div class='two'></div>
    <div class='two_all'></div>
</div>


я нажал на первый див one и мне надо обратиться к диву с классом two но только к тому в котором мы нажали


ка то так )))

Последний раз редактировалось Trues, 06.04.2015 в 13:01.
Ответить с цитированием
  #6 (permalink)  
Старый 06.04.2015, 13:15
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,135

Сообщение от Trues
я нажал на первый див one и мне надо обратиться к диву с классом two но только к тому в котором мы нажали
Как вариант...

<!DOCTYPE html>
<html>
<head>
<script src='http://code.jquery.com/jquery-latest.js'></script>
<!--
<script src="https://code.angularjs.org/1.3.9/angular.min.js"></script>
<script src="https://code.angularjs.org/1.3.9/angular-route.js"></script>
<link rel='stylesheet type=text/css href=tmp.css' />
-->
<style type='text/css'>
.one {
	border: 1px solid;
}
</style>
<script type='text/javascript'>
$(function(){
	$('.one').click(function(){
		alert($(this).children('.two').text());
	});
});
</script>
</head>
<body>
<div class='one'>
    <div class='two'>1</div>
    <div class='two_all'>2</div>
</div>
<div class='one'>
    <div class='two'>3</div>
    <div class='two_all'>4</div>
</div>
</body>
</html>
Ответить с цитированием
  #7 (permalink)  
Старый 06.04.2015, 13:18
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Вам же сказали - .children().
<html> 
<head> 
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
<script> 
$(function() {
    $('div.one').click(function() {
        $(this).children().each(function() {
            alert(this.innerHTML)
        })
    })
});
</script>     
</head> 

<body>
<div class='one'>
    <div class='two'>aaa</div>
    <div class='two_all'>bbb</div>
</div>
 
<div class='one'>
    <div class='two'>ccc</div>
    <div class='two_all'>ddd</div>
</div>
</body> 
</html>
Ответить с цитированием
  #8 (permalink)  
Старый 06.04.2015, 13:21
Аватар для ksa
ksa ksa вне форума
CacheVar
Отправить личное сообщение для ksa Посмотреть профиль Найти все сообщения от ksa
 
Регистрация: 19.08.2010
Сообщений: 14,135

Сообщение от laimas
Вам же сказали - .children().
Просто ты это как-то не внятно так произнес...
Ответить с цитированием
  #9 (permalink)  
Старый 06.04.2015, 13:26
Профессор
Отправить личное сообщение для laimas Посмотреть профиль Найти все сообщения от laimas
 
Регистрация: 14.01.2015
Сообщений: 12,990

Исправляюсь - .children()
Так звучит?
Ответить с цитированием
  #10 (permalink)  
Старый 06.04.2015, 13:27
Аспирант
Отправить личное сообщение для Trues Посмотреть профиль Найти все сообщения от Trues
 
Регистрация: 19.02.2015
Сообщений: 71

просто я глуп))) и не смог разобраться в документации. а сейчас все понял спасибо большое очеень помогли всем по плюсу к карме)
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Пропадает див после выхода за границы дива darksmoke Элементы интерфейса 0 19.11.2014 18:29
Сайт с див контентом Rastabong jQuery 1 14.07.2013 17:09
Скрыть хитрый див spurlos Общие вопросы Javascript 2 22.11.2012 12:02
Всплывающий див около курсора Andrejs Элементы интерфейса 1 11.02.2011 17:08
задействовать только дочерний элемент roma86 jQuery 2 03.10.2009 21:36