0

подскажите пожалуйста как передать значение переменной выводящийся в цикле пхп в яваскрипт. Нужно что бы в переменной яваскрипт было значение не последнего значения а то которое соответствует итерации цикла.

function showTooltip()
   {
           var myDiv = document.getElementById('<?= $numberShow; ?>');
           var myLink = document.getElementById('link');
           
           console.log(myDiv);

  if(myDiv.style.display == 'none')
        {
           myDiv.style.display = 'block';
           myLink.style.display = 'none';
} 

else {
           myDiv.style.display = 'none';
}
return false;
<?php if( have_rows('lp_phone', 'option') ): ?>
            <?php while( have_rows('lp_phone', 'option') ): the_row(); 

             $number = get_sub_field('lp_number', 'option');
             $icon = get_sub_field('number_icon', 'option');
             $numberShow = get_sub_field('id_show', 'option');
             ?>

             <div class="contacts-number">
                 <span class="contacts-number-icon"><?= $icon; ?></span>
                 <a href='javascript:;' onclick=showTooltip() id="link"> +38xxx-xxx-xx-xx </a>
                 <div id=<?= $numberShow; ?> style='display: none'><?= $number; ?></div>
             </div>
                  <?php endwhile; ?>
                  <?php endif; ?>

То есть сейчас в переменной myDiv значение послденей итерации цикла пхп. Нужно что бы по нажатия на ссылку открывался конкретный номер телефона а не последнее значение.

2 ответа 2

0

Ну может так

<div class="contacts-number">
                 <span class="contacts-number-icon"><?= $icon; ?></span>
                 <a href='javascript:;' onclick=showTooltip(<?= $numberShow; ?>) id="link"> +38xxx-xxx-xx-xx </a>
                 <div id=<?= $numberShow; ?> style='display: none'><?= $number; ?></div>
             </div>

не знаю за php как будет но так 100 проц можно

 <div class="contacts-number">
                     <span class="contacts-number-icon"><?= $icon; ?></span>
                     <a href='javascript:;' sosed-id='<?= $numberShow; ?>'  onclick=showTooltip(this) id="link"> +38xxx-xxx-xx-xx </a>
                     <div id=<?= $numberShow; ?> style='display: none'><?= $number; ?></div>
                 </div>

и в js так тогда

function showTooltip(this)
   {
           var id = this.getAttribute('sosed-id');
           var myDiv = document.getElementById(id);
           var myLink = document.getElementById('link');

           console.log(myDiv);

  if(myDiv.style.display == 'none')
        {
           myDiv.style.display = 'block';
           myLink.style.display = 'none';
} 

else {
           myDiv.style.display = 'none';
}
return false;
1
  • спасибо большое, за помощь, но увы выдает ошибки. мне добрый человек на другому форуме помог, сейчас опубликую код. он очень похож на Ваше решение. Большое Вам спасибо за помощь 14 фев 2019 в 12:04
0

Решение не мое, помог хороший человек.

function showTooltip(link) {
  const div = link.parentNode.querySelector('div');

  if (div.style.display === 'none') {
    div.style.display = 'block';
    link.style.display = 'none';
  } else {
    div.style.display = 'none';
  }
}
onclick="showTooltip(this)"

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.