Как менять текст одного элемента при клике на другой?

Question

[DennyD314]

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

<div onclick="change_descr({{ target.description }})">

В конце документа

<script type="text/javascript">
    function change_descr(text) {
        $(function(){
            $('#description').text(text);
        });
    }
    </script>

Вероятнее всего, я много чего делаю не так, так как с версткой, в особенности с JS, абсолютно не дружу.
Подскажите пожалуйста, в чем ошибка и как лучше реализовать такой функционал?

Comments

[Сергей delphinpro]

function change_descr(text) {
       // $(function(){
            $('#description').text(text);
       // });
    }

Answer 1

[MrTimon]

Я бы посоветовал выводить текст в блоке слайдера в каком-то захайдженом диве и избавиться от инлайновых вызовов фунции. Получаэтся как то так.
Сначала в верске

<div class="slider-block-element"> 
    <div class="desc" style="display:none;">{{ target.description }}</div>
    ....
</div>

И потом вконец

<script type="text/javascript">
    $(document).ready(function() {
        $('.slider-block-element').on('click',function() {
            $('#description').html($(this).find('.desc').html());
        })
    });
</script>

Comments

[DennyD314]

$(this).find('.desc').html()
Эта конструкция не работает почему-то.
А если убрать $(this).find , то появляется текст всегда первого элемента (ожидаемо).
Что не так?

[MrTimon]

DennyD314: Не знаю что у вас не так, как по мне - должно работать. Вот пример . Может у вас какая-то синтаксическая ошибка.

[DennyD314]

MrTimon: Спасибо!

Answer 2

[Сергей Сунцев]

Ставишь обработчик события на один элемент, и меняешь текст в другом.
Самый простой вариант https://codepen.io/Greyewi/pen/JNXEYJ

Comments

[Сергей Сунцев]

Если надо передавать текст, то можно так :
https://codepen.io/Greyewi/pen/xdVgVd?editors=1011