Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   document.getElementById (https://javascript.ru/forum/events/57962-document-getelementbyid.html)

Ramzes94 28.08.2015 09:39

document.getElementById
 
Ребят доброго времени суток)
Как сделать так чтобы добавлялись два значения при клике на каждое из них?
Также можно ли реализовать чтобы можно было удалять не нужное значение?
Подчеркну сразу будут несколько значений.
Тот кто реализует 100рублей переведу в знак благодарности
Можно без использования document.getElementById и textarea если это возможно конечно предложите свой код.
Подробно на картинке все рассписано
<a href="#" onclick="document.getElementById('idn').value = 'Значение 1'">Значение 1</a>
<a href="#" onclick="document.getElementById('idn').value = 'Значение 2'">Значение 2</a><br />
<textarea class="" type="text" id="idn" placeholder="Вставка"></textarea>

laimas 28.08.2015 09:59

По рукам надо бить за такое использование тега А. И зачем их два, если в любом случае добавляются два значения? Хватит одного элемента с двумя передаваемыми значениями.
А вот из двух элементов, значения которых в любом случае идут в набор, удалить ненужное, это уже перебор.

Pavel M. 28.08.2015 10:01

Цитата:

Сообщение от Ramzes94
Как сделать так чтобы добавлялись два значения

можно так
<a href="#" onclick="document.getElementById('idn').value = 'Значение 1 ' + this.nextElementSibling.textContent">Значение 1</a>
<a href="#" onclick="document.getElementById('idn').value = 'Значение 2'">Значение 2</a><br />
<textarea class="" type="text" id="idn" placeholder="Вставка"></textarea>

Rise 28.08.2015 10:23

Ramzes94, у textarea нет атрибута type

Ramzes94 28.08.2015 10:32

Это я для образца сделал так как по другому не умею.
Да я в курсе что type не должно быть в textarea это ерунда не столь важно.
Можно вообще сделать по вашему.
Главное чтобы при клике на нужную услугу оно добавляла свое значение и чтобы человек мог выбрать еще услуги по мимо выбранной.
Также удалять не нужное.

Ramzes94 28.08.2015 10:42

Цитата:

Сообщение от Pavel M. (Сообщение 386092)
можно так
<a href="#" onclick="document.getElementById('idn').value = 'Значение 1 ' + this.nextElementSibling.textContent">Значение 1</a>
<a href="#" onclick="document.getElementById('idn').value = 'Значение 2'">Значение 2</a><br />
<textarea class="" type="text" id="idn" placeholder="Вставка"></textarea>

Не два сразу одновременно, а по одному если допустим я кликнул на значение 1 добавляется значение один если я еще кликнул на значение 2 до к значению один в textarea добавляется ниже значение 2)))

laimas 28.08.2015 10:45

Цитата:

Сообщение от Ramzes94
Не два сразу одновременно, а по одному если допустим я кликнул на значение 1 добавляется значение один если я еще кликнул на значение 2

Значит вопрос ставите некорректно. Нужно перебирать в цикле элементы которыми производится набор (только A с href=#, это даже и комментировать не охота. Можно щелкнуть по любому элементу, не только А кликабельно). Отмечать выбранные (по какому либо признаку, если это будет список с мультивыбором, что собственно и нужно бы, и хватило бы, то проще), ну и соответственно вносить эти данные во что-то.

Rise 28.08.2015 10:48

Ramzes94, можно использовать протокол javascript вместо... а ну ты же в курсе, ладно тогда))

laimas 28.08.2015 10:53

Цитата:

Сообщение от Rise
можно использовать протокол javascript вместо

Лучше вообще не использовать :)

На сервер же данные передаются, так спрашивается зачем же их в таком неудобном виде передавать - текстом в форму, а на сервере разбирать? Тут либо select multiple, либо набор флажков, а тег А, это извращение. )

Ramzes94 28.08.2015 10:58

Вот если бы ты спросил у меня про Авто детали, я бы еще смог ответить на твой вопрос))
Ребят вам виднее как проще сделать, я в этом не шарю) Поэтому вопрос приходится 10 раз переделывать.

Ramzes94 28.08.2015 10:59

Я вам щас образец нарисую что я имею ввиду так понятней будет)

Ramzes94 28.08.2015 11:00

Цитата:

Сообщение от laimas (Сообщение 386111)
Лучше вообще не использовать :)

На сервер же данные передаются, так спрашивается зачем же их в таком неудобном виде передавать - текстом в форму, а на сервере разбирать? Тут либо select multiple, либо набор флажков, а тег А, это извращение. )

Да он просто умничает через чур)))

laimas 28.08.2015 11:04

Значение 1, Значение 2... - это что ID услуг? По крайней мере это логичнее, недели текста. А выбор нескольких услуг, это передать на сервер их ID. Чем на страницах обеспечивают выбор множества? Набором флажков или списком со множественным выбором (последний можно под список с флажками имитировать).
И не надо никаких текстовых областей, в которую запихивать это набор.

laimas 28.08.2015 11:04

Цитата:

Сообщение от Ramzes94
Да он просто умничает через чур)))

Ну-ну.

Ramzes94 28.08.2015 11:20


рони 28.08.2015 14:06

<!DOCTYPE HTML>

<html>

<head>
  <title>Untitled</title>
  <meta charset="utf-8"><style type="text/css">
span{
  margin: 5px;
  font-size: 24px;
  color: #FF0000;
  cursor: pointer;
}
span.test{
  margin: 5px;
  font-size: 16px;
  color: #000000;
}
span.test:after{
  content: '';
  display: block;
}

</style>
</head>

<body>
<span>что</span><span>где</span><span>когда</span><span>почему</span><span>как</span>
<div></div>
<script>
 [].forEach.call(document.querySelectorAll('span'), function(item) {
         item.addEventListener('click', function() {
             var div = document.querySelector('div');
             var clone = item.cloneNode(true);
             div.appendChild(clone);
             var del = item.cloneNode();
             del.innerHTML = 'X';
             del.className = 'test';
             del.addEventListener('click', function() {
             div.removeChild(clone);
             div.removeChild(del);
             })
             div.appendChild(del);;
         });
     });
</script>
</body>

</html>

Ramzes94 28.08.2015 14:10

Ну разве не красавчик))


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