Форум

Antonqq · #1 (**permalink**) 05.11.2016, 21:44

Нужно чтобы по нажатию выводило номер li, какой он по счету.
Произвожу нумерацию следующим образом:

<ul class="list">
		<li class="dd-item"  onclick="bui()">
			<div class="dd-handle">кат 1</div>
			<ul class="list">
				<li class="dd-item"  onclick="bui()">
					<div class="dd-handle">кат 1.3</div>
					<ul class="list">
					</ul>
				</li>
				<li class="dd-item"  onclick="bui()">
					<div class="dd-handle">кат 1.2</div>
					<ul class="list">
					</ul>
				</li>
				<li class="dd-item"  onclick="bui()">
					<div class="dd-handle">кат 1.1</div>
					<ul class="list">
					</ul>
				</li>
			</ul>
		</li>
	</ul>

function bui() {
			$('li.dd-item').each(function(i){
				$(this).click(function(){
					$('.adsadd').html(++i);
				});
			});
	}

Когда li в столбец без родителей, все правильно выводит.

А когда наследую:

<ul>
		<li>
			<div>кат 1</div>
			<ul>
				<li>
					<div>кат 2</div>
				</li>
			</ul>
		</li>
	</ul>

Нумерация дочерних элементов останавливается на родителе

Aetae · #2 (**permalink**) 05.11.2016, 21:53

Такими темпами ты вечность пилить будешь.
Скажи какая именно задача у тебя стоит.

Antonqq · #3 (**permalink**) 05.11.2016, 22:00

У меня есть дерево категорий, осталось определить их позицию и записать в бд

рони · #4 (**permalink**) 05.11.2016, 22:24

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

Нумерация дочерних элементов останавливается на родителе

event.stopPropagation();

рони · #5 (**permalink**) 05.11.2016, 22:28

Antonqq,
function bui бесполезная и вредная , замените её на ready если ul.list неизменно или на on если нужно актуально

рони · #6 (**permalink**) 05.11.2016, 22:31

Antonqq,

<!DOCTYPE html>

<html>
<head>
  <title>Untitled</title>
  <meta charset="utf-8">
  <style type="text/css">
  </style>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

  <script>
$(function() {


        $('.list').on('click', 'li.dd-item', function(event){
          event.stopPropagation();
          var i = $('li.dd-item').index(this);
          $('.adsadd').html(++i);
        });



});
  </script>
</head>

<body>
<ul class="list">
    <li class="dd-item"  >
      <div class="dd-handle">кат 1</div>
      <ul class="list">
        <li class="dd-item"  >
          <div class="dd-handle">кат 1.3</div>
          <ul class="list">
          </ul>
        </li>
        <li class="dd-item"  >
          <div class="dd-handle">кат 1.2</div>
          <ul class="list">
          </ul>
        </li>
        <li class="dd-item"  >
          <div class="dd-handle">кат 1.1</div>
          <ul class="list">
          </ul>
        </li>
      </ul>
    </li>
  </ul>
<div class="adsadd"></div>

</body>
</html>

Antonqq · #7 (**permalink**) 05.11.2016, 23:59

Все замечательно работает, спасибо большое)
Не подскажете как как реализовать следующею вещь:
При нажатии на <li> , нужно вытащить из <li>-родителя атрибута data-id (число), и записать в его атрибут data-parent, по которому произведен клик.
Целый день над этим голову ломаю, не знаю как вытащить из родительского ((

Aetae · #8 (**permalink**) 06.11.2016, 00:15

$('li').click(function(){
  var $this = $(this);
  $this.data( 'parent', $this.parents('li[data-id]').data('id') )
})

рони · #9 (**permalink**) 06.11.2016, 00:18

Antonqq,
может почитать чего ...

var id = $(this).parents('li:first').data('id')

Antonqq · #10 (**permalink**) 06.11.2016, 00:52

Это работает

var id = $(this).parents('li:first').data('id');

Но оно получает id у самого первого родителя, а у меня дерево.
Нужно id того родителя, что на один выше

Форум

Справочник

Discord чат

Курсы javascript