Передача text из div в поле value
Есть галерея, в ней по клику меняется изображение и один див замещает другой (посредством "style="display: block;", в данном диве содержится название файла, необходимо именно из активного дива ("style="display: block;") вытащить название файла и присвоить value в inpute.
Буду очень благодарен за помощь. |
Получить в input текст div, вроде бы, так можно
<script type="text/javascript">
function sendValueInInput()
{
a = document.getElementById('myInput');
b = document.getElementById('myDiv');
a.value = b.innerText;
}
</script>
<div id="myDiv" style="border: 1px solid red;">Текст <br>контейнера</div>
<input id="myInput" type="text">
<br>
<input type="button" value="Отправить" onclick="sendValueInInput()">
|
Суть в том, что в моем случае нужен активный див (т.е. style="display:block").
Приведу пример: <div id="box_lol_container1" class="box_lol_container" style="overflow: auto;"> <div class="lol_div" style="display: block;">image-1.jpg </div> <div class="lol_div" style="display: none">image-2.jpg </div> <div class="lol_div" style="display: none">image-3.jpg </div> Первое по умолчанию стоит содержимое с контентом "image-1.jpg", после клика по изображения "style="display: block" присваивается следующему диву, следовательно на месте "image-1.jpg" стоит уже текст "image-2.jpg", мне необходим текст из актуального дива с "style="display: block". :-? |
<div id="box_lol_container1" class="box_lol_container" style="overflow: auto;">
<div class="lol_div" style="display: block;">image-1.jpg </div>
<div class="lol_div" style="display: none">image-2.jpg </div>
<div class="lol_div" style="display: none">image-3.jpg </div>
<input type="text" id="input" value='' />
<script type="text/javascript">
var input = document.getElementById('input');
var container = document.getElementById('box_lol_container1');
var lol_divs = document.getElementsByClassName('lol_div');
for(var i=0;i<lol_divs.length; i++) {
var lol_div = lol_divs[i];
var computedStyle = getComputedStyle(lol_div)|| lol_div.currentStyle;
if(computedStyle.display == 'block') {
input.value = lol_div.innerHTML;
}
}
|
Ссылка: http://learn.javascript.ru/play/b14wr
Подскажите, как сделать чтоб запускалось здесь, а не в песочнице (к сожалению подзабылось) или ссылку, где об этом прочитать. |
eirnvn,
Замените открывающий тег [html] на [html run]. |
Спасибо большое, с меня пиво, чай минимум)
Только одно но, скрипт выводит текст только с активного (style="display:block") дива на момент загрузки страницы, здесь необходимо выводить измененный текст при каждом клике, не переходя со страницы (динамически). |
Пиво не катит, только молоко. За вредность.
Вариантов много, смотря ,что вы хотите, возможно так (кликать по картинке).
<div id="box_lol_container1" class="box_lol_container" style="overflow: auto;">
<div class="lol_div" style="display: block;">image-1.jpg </div>
<div class="lol_div" style="display: none">image-2.jpg </div>
<div class="lol_div" style="display: none">image-3.jpg </div>
</div>
<input type="text" id="input" value='' />
<script type="text/javascript">
var input = document.getElementById('input'),
container = document.getElementById('box_lol_container1'),
lol_divs = document.getElementsByClassName('lol_div'),
lol_div;
input.value = lol_divs[0].innerHTML;
container.onclick = function(e) {
var target = e && e.target|| event.srcElement;
var next = target.nextElementSibling ||target.parentNode.firstElementChild;
if(!next) {next = target.parentNode.firstElementChild; next.style.display ='block';}
else {next.style.display = 'block'};
target.style.display = "none";
input.value = next.innerHTML;
}
/* ^ ^
^^^^^^
| @ @ |
( = ~ = ) *
- **
***** ***
********** ***
****************** **
***********************
******************** */
</script>
|
| Часовой пояс GMT +3, время: 09:28. |