javascript случайный контент в подсказке. Как добавить место при необходимости

Я использую JQuery для всплывающей подсказки из скрытого <span>. Что я делать то, что я хранить каждый <span> значения в JavaScript переменных, а затем я добавить тезисы переменные в мою подсказку как этот AppendTo tooltip(var1+var2+var3+etc..)javascript случайный контент в подсказке. Как добавить место при необходимости

Моей проблема заключается в том, что я должен сделать пункт пространства (дополнение) между некоторыми из отображаемого контента. Иногда моя подсказка показывает только var1 и var2 (var3 и var4 пусты).

Для интервала я фактически использую css padding-bottom на var2. Поэтому, если var3 не пуст, пространство необходимо, но если var3 пуст, я получаю нежелательное пространство.

Я пытаюсь выяснить, как я могу добавить пробел только тогда, когда я уверен, что после var2 будет некоторый контент. Я думаю о некотором счетчике. Как

if var1 not empty counter++ 
if var2 not empty counter++ 
if var3 not empty counter++ 
If counter > 2 var2 = var2 + space

Но, может быть, вы, ребята, есть идея получше :)

Ниже мой код:

<script> 
first_name = ''; 
last_name = ''; 
phone = ''; 
email = ''; 
address = ''; 
tip_first_name = ''; 
tip_last_name = ''; 
tip_phone = ''; 
tip_email = ''; 
tip_address = ''; 

first_name = $(this).children('span[class=p_first_name]').attr("data-tooltip"); 
    if(first_name != null)tip_first_name = '<span class="tooltip_first_name">'+first_name+'</span>'; 
last_name = $(this).children('span[class=p_last_name]').attr("data-tooltip"); 
    if(last_name != null)tip_last_name = '<span class="tooltip_last_name">'+last_name+'</span>'; 
phone = $(this).children('span[class=p_phone]').attr("data-tooltip"); 
    if(phone != null)tip_phone = '<span class="tooltip_phone">'+phone+'</span>'; 
email = $(this).children('span[class=p_email]').attr("data-tooltip"); 
    if(email != null)tip_email = '<span class="tooltip_email">'+email+'</span>'; 
address = $(this).children('span[class=p_address]').attr("data-tooltip"); 
    if(address != null)tip_address = '<span class="tooltip_address">'+address+'</span>'; 

$('#hint').before('<div id="tip" class="tip"><div class="tip-personn">'+tip_first_name+tip_last_name+tip_phone+tip_email+tip_address+'</div></div>'); 

</script> 
<style> 
.tooltip_last_name{ 
    padding-bottom:10px; 
}

источник

2013-08-01 yves

Для уточнения; вы спрашиваете о том, как добавить стиль/интервал в div.personn? –

Да, но только если у меня одна, следующая переменная (телефон, адрес электронной почты или адрес) не пуст. На самом деле у меня больше трех переменных (около 20) – yves

This JSFiddle должен решить вопрос, он использует CSS смежный селектор родственный (см. ниже), будет нацелен на 2-й, 3-й, 4-й (и т. д.) промежутки.

div.tip span + span { 
    padding-top: 10px; 
}

Более подробная информация о родственных и дочерних селекторов here

источник

2013-08-02 20:22:57

Эй, чё! Это потрясающе! Я думаю, что я использовал это долгое время назад, но я никогда не думал, что нужно использовать этот случай. Спасибо, в любом случае!! Помогает мне много :) – yves

javascript случайный контент в подсказке. Как добавить место при необходимости

ответ

Смежные вопросы