Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   Как при клике на блок достать его данные и занести в другой блок. (https://javascript.ru/forum/jquery/36559-kak-pri-klike-na-blok-dostat-ego-dannye-i-zanesti-v-drugojj-blok.html)

Vladislav 19.03.2013 17:49

Как при клике на блок достать его данные и занести в другой блок.
 
Здравствуйте, у меня на сайте есть блок с комментариями и поле для ввода и отправки этих комментариев. Мне нужно, чтобы при нажатии на имени (class='name') в input (id='message') заносилось имя этого пользователя. Вот html:

Блок для написания и отправки комментариев:
<form>
<input type='text' id='message'>
<input type='type='submit' id='button'>
</form>

Блок с комментариями:
<div id='all_comments'>
    <div class='comment'><span class='name'>Владислав:</span> Всем       привет!</div>
    <div class='comment'><span class='name'>Виктор:</span> Владислав, привет! Как у тебя дела?</div>
    <div class='comment'><span class='name'>Оля:</span> И вам того же.</div>
</div>


То есть если я сейчас нажму на класс name, а именно на имя Оля, в input id='message' должно занестись ее имя, вот так вот:


--Блок отправки сообщения--
Оля, ...
------------------------------

Я в принципе могу это реализовать, только я не знаю как достать именно данные из блока с классом name?

Вот как я могу реализовать:

<script>
$(function(){
   $('.chat_block').on('click', '.name', function () {
      var span= $(this).closest('span');
      var name= span.find(".chat_name").val();      
      $("#message").val("TEST-name");                                                                                                                         
    });
});
</script>


Но этот js код заносит не значение блока name, а строчку: TEST-name

Keeper 19.03.2013 17:57

Если правильно понял:
$(document).on('click','.name',function(e){
$("#message").val($(this).text());
});

Vladislav 19.03.2013 18:08

Я зря столько рассписывал, нужно было просто спросить:

как при клике на блок получить его данные/содержимое, например блок:

<div clas='text'>Текст, который я хочу занести в переменную name при клике на него</div>.

А потом отобразить переменную name (в которой будет находиться уже текст блока с классом text) в input с class='message'

Keeper 19.03.2013 18:14

Vladislav,
вы ответ получили? )

$(document).on('click','.name',function(e){
    var name = $(this).text();
    $("#message").val(name);
});

Vladislav 19.03.2013 18:25

Ой... что-то затупил, да я написал как вы все получилось, спасибо) Но у меня еще один вопрос есть, как сделать так, чтобы не только вот это имя добавлялось в input, а еще этот инпут становился как focus, то есть чтобы не нужно было активировать его, а он сам активировался, после того как добавиться переменная name в него.

И еще один вопрос, зачем вы пишите "..'.name',function(e){...", буковку "e", что она дает?

Vladislav 19.03.2013 21:16

а?

Keeper 20.03.2013 10:23

Я конечно подскажу, но вам не мешало бы поиметь базовые знания по JavaScript и jQuery, что бы чему то научится...
Про фокус. Добавьте:

$("#message").focus();

По поводу "е"

При срабатывании события, в функцию-обработчик передается объект, который описывает событие, и писать её у меня уже вошло в привычку.

Изучайте матчасть!

Vladislav 20.03.2013 12:17

Спасибо, что помогаете! Обязательно буду учить матчасть!

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

Вот js код:

$(document).on('click','.chat_name',function(e){
    var name = $(this).text()+", ";
    $("#message").val(name).focus();

});


Вот картинки, как все это выглядит:




Keeper 20.03.2013 12:58

Ну дак поменяйте местами команды val и focus, емаё

Vladislav 20.03.2013 13:51

ппц я нубас) спасибо получилось!


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