1

Есть следующий html:

<ul id="Pagination">
    <li class="ImagePrev"><?php previous_post_link('<a>%link</a>')?></li>
    <li class="ImageNext"><?php next_post_link('<a>%link</a>')?></li>
</ul>

У каждого li есть свой background и, если отсутствует ссылка, нужно чтобы пропадал background!
Моя попытка:

if(("#Pagination a") == 0){
    alert("1");
  }
2
  • 1
    Вы наверное хотели написать if($("#Pagination a").length == 0) ? 25 мая 2016 в 6:23
  • Если имеется ввиду, что домен под ссылкой живой - это можно проверить через img тег наличие картинки на другом сайте (это не означает что страницу куда ссылается ccылка не могут удалить), используя onerror событие. А так с помощью JS можно проверить только синтаксиз ссылки.
    – nick_n_a
    25 мая 2016 в 6:27

2 ответа 2

1

Селектор :empty выберет li, у которых нет содержимого. Это решает задачу?

1) через CSS

https://jsfiddle.net/glebkema/854oopmp/

/* heart of the matter */
.ImagePrev {
  background-color: green;
}
.ImagePrev:empty {
  background-color: grey;
}

/* nice look */
#Pagination {
  display: block;
  list-style-type: none;
  margin: 0;
  overflow: hidden;
  padding: 0;
}
#Pagination li {
  display: block;
  float: left;
  height: 100px;
  margin: 10px;
  width: 100px;
}
#Pagination li > a {
  color: white;
  display: block;
  height: 100px;
  width: 100px;
}
<ul id="Pagination">
  <li class="ImagePrev"></li>
  <li class="ImagePrev"><a></a></li>
  <li class="ImagePrev"><a>link</a></li>
  <li class="ImagePrev"><a href="link">link</a></li>
</ul>


2) через jQuery

https://jsfiddle.net/glebkema/hmw21yyr/2/

$(document).ready(function() {
  $('.ImagePrev:empty').css('background-color', 'grey');
});
/* heart of the matter */
.ImagePrev {
  background-color: green;
}

/* nice look */
#Pagination {
  display: block;
  list-style-type: none;
  margin: 0;
  overflow: hidden;
  padding: 0;
}
#Pagination li {
  display: block;
  float: left;
  height: 100px;
  margin: 10px;
  width: 100px;
}
#Pagination li > a {
  color: white;
  display: block;
  height: 100px;
  width: 100px;
}
<ul id="Pagination">
  <li class="ImagePrev"></li>
  <li class="ImagePrev"><a></a></li>
  <li class="ImagePrev"><a>link</a></li>
  <li class="ImagePrev"><a href="link">link</a></li>
</ul>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

0

Нашел ответ )

if($(".ImagePrev").children('a').length === 0){
    $(".ImagePrev").hide();
  }
4
  • первый комментарий от Алексея в вашем вопросе, более корректный, я бы сказал, вызывать лишний метод здесь ну уж совсем не нужно 25 мая 2016 в 6:38
  • @ВасилийБарбашев вообще скорее ни мой ни этот ответ не являются до конца правильными....... на самом деле надо пробегаться по всем .ImagePrev и прятать лишь определенные блоки..... а так получится что скроются все...... и то в случае, если везде нет ссылок ........ а надо бы $(".ImagePrev").each(function(){ if ($(this).find('a').length == 0) { $(this).hide(); } }); 25 мая 2016 в 6:43
  • @АлексейШиманский ну да, тут надо фигурировать this, кстати попробуй писать не $(this).find('a'), а $('a', this), структурно меньше методов вызывается 25 мая 2016 в 7:30
  • @ВасилийБарбашев, там же все равно внутри тот же самый find
    – Grundy
    25 мая 2016 в 9:06

Ваш ответ

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

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