Форум программистов, компьютерный форум, киберфорум
jQuery
Форум программистов и сисадминов Киберфорум > Форум вебмастеров > JavaScript > jQuery
Войти
Регистрация
Восстановить пароль
Карта форума Темы раздела Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 5.00/21: Рейтинг темы: голосов - 21, средняя оценка - 5.00
101 / 100 / 51
Регистрация: 19.04.2011
Сообщений: 961
1

Проверить наличие текста до и после элемента

14.01.2017, 11:08. Показов 3939. Ответов 13
Метки нет (Все метки)
Author24 — интернет-сервис помощи студентам
Здравствуйте.
Не могу победить возникшую задачу. Мне необходимо перед и после блока с классом inline-attachment поставить тег <br />, но только в том случае, если перед блоком есть текст, если передо блоком нету текста, то не надо добавлять перенос строки. Так же и после блока, надо проверить наличие текста, если есть - добавить перенос. После блока может быть такой же блок, его переносить не надо...

Как поставить перенос я знаю:
Javascript
1
2

    $('.inline-attachment').before('<br />');
    $('.inline-attachment').after('<br />');
А как проверить наличие текста, не могу сообразить... Подскажите, как проверяется наличие текста?
Спасибо.
0
Лучшие ответы (1)
Сообщение: #10006294
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
 14.01.2017, 11:08
Ответы с готовыми решениями:

Проверить наличие класса у элемента
Добрый день , не могу понять почему не срабатывает alert &lt;a class=&quot;btn checked&quot; href=&quot;/&quot; &gt;в...

Проверить тэг на наличие контента в виде текста
Проверить тэг на наличие контента в виде текста или дерева внутренних тегов

Как проверить наличие у элемента класса CSS БЕЗ Jquery
Подскажите как проверить наличие у элемента класса CSS БЕЗ использования Jquery? хочу написать...

Как проверить наличие элемента и если он есть удалить его по клику
Приветствую, у меня есть код: var modalbtn=document.querySelectorAll(&quot;.modal__btn&quot;); for (var i =...

13
2382 / 1386 / 655
Регистрация: 23.08.2015
Сообщений: 3,463
15.01.2017, 01:03 2
Raisin Zn,
Javascript
1
2
3
4
5
6
7
8
9

$('.inline-attachment').each(function(){
    var $this = $(this);
    if(!!this.previousSibling.textContent.trim()) {
     $this.before('<br />');
  }
  if(!!this.nextSibling.textContent.trim()) {
     $this.after('<br />');
  }
})
Добавлено через 29 секунд
https://jsfiddle.net/a2xL7be8/
1
101 / 100 / 51
Регистрация: 19.04.2011
Сообщений: 961
15.01.2017, 04:14  [ТС] 3
sad67man, большое спасибо, Ваш код работает!

Теперь тег переноса на новую строку добавляется, если перед или после блока следует текст, но если текст идет форматированным, выделен каким ни будь тегом, то перенос не добавляется. Я подумал, что тут лучше проверять не наличие текста, а наличие такого же блока рядом с этим блоком, то есть .inline-attachment перед или после .inline-attachment.
Как такое сделать?

Еще, если после блока ни чего нет, то в в консоли ошибка: Uncaught TypeError: Cannot read property 'textContent' of null и остальные JS не работают...
0
2382 / 1386 / 655
Регистрация: 23.08.2015
Сообщений: 3,463
15.01.2017, 04:23 4
Raisin Zn, Вообще это делать лучше на стороне сервера при формирования вывода блоков.
0
101 / 100 / 51
Регистрация: 19.04.2011
Сообщений: 961
15.01.2017, 04:25  [ТС] 5
https://jsfiddle.net/a2xL7be8/ - тут без ошибок отрабатывает, а у меня на странице, с ошибкой, если после блока ни чего нет...

Добавлено через 1 минуту
Цитата Сообщение от sad67man Посмотреть сообщение
Вообще это делать лучше на стороне сервера при формирования вывода блоков.
Дело в том, что в код ядра залесть нельзя, пока нет официального расширения для решения моей задачи, я хочу использовать вот такой "костыль"...
0
2382 / 1386 / 655
Регистрация: 23.08.2015
Сообщений: 3,463
15.01.2017, 04:27 6
Raisin Zn, чтоб избежать ошибки расширьте условие.
Javascript
1
2
3
4
5
6
7
8
9

$('.inline-attachment').each(function(){
    var $this = $(this);
    if(this.previousSibling && !!this.previousSibling.textContent.trim()) {
     $this.before('<br />');
  }
  if(this.nextSibling && !!this.nextSibling.textContent.trim()) {
     $this.after('<br />');
  }
})
Добавлено через 1 минуту
Raisin Zn, на счет форматирования сейчас подумаю)
1
101 / 100 / 51
Регистрация: 19.04.2011
Сообщений: 961
15.01.2017, 04:30  [ТС] 7
sad67man, спасибо!
Ошибка пропала!
0
2382 / 1386 / 655
Регистрация: 23.08.2015
Сообщений: 3,463
15.01.2017, 05:01 8
Raisin Zn, https://jsfiddle.net/a2xL7be8/1/
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13

$('.inline-attachment').each(function(){
    var $this = $(this);
  var isPrevHasClass = $this.prev().length && !$this.prev().hasClass('inline-attachment');
  var isNextHasClass = $this.next().length && !$this.next().hasClass('inline-attachment');
  var isPrevText = this.previousSibling && !!this.previousSibling.textContent.trim();
  var isNextText = this.nextSibling && !!this.nextSibling.textContent.trim();
  if(isPrevHasClass || isPrevText) {
    $this.before('<br />');
  }
  if(isNextHasClass || isNextText) {
    $this.after('<br />');
  }
})
0
2382 / 1386 / 655
Регистрация: 23.08.2015
Сообщений: 3,463
15.01.2017, 05:03 9
Лучший ответ Сообщение было отмечено Raisin Zn как решение

Решение

Raisin Zn, https://jsfiddle.net/a2xL7be8/1/
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13

$('.inline-attachment').each(function(){
    var $this = $(this);
  var isPrevHasClass = $this.prev().length && !$this.prev().hasClass('inline-attachment');
  var isNextHasClass = $this.next().length && !$this.next().hasClass('inline-attachment');
  var isPrevText = this.previousSibling && !!this.previousSibling.textContent.trim();
  var isNextText = this.nextSibling && !!this.nextSibling.textContent.trim();
  if(isPrevHasClass || isPrevText) {
    $this.before('<br />');
  }
  if(isNextHasClass || isNextText) {
    $this.after('<br />');
  }
})
1
101 / 100 / 51
Регистрация: 19.04.2011
Сообщений: 961
15.01.2017, 05:16  [ТС] 10
sad67man, круто! Вы волшебник!
Большое Вам спасибо! Вы меня спасли!
0
2382 / 1386 / 655
Регистрация: 23.08.2015
Сообщений: 3,463
15.01.2017, 05:42 11
Raisin Zn, Принципиальный момент) Немножечко по семантике ошибся) судя по названию переменный isNextHasClass и isPrevHasClass должны возвращать true в случае, если класс имеется. Однако тут идет от обратного. Стоит их переименовать на isNextHasNoClass ну или что-то подобное)
1
101 / 100 / 51
Регистрация: 19.04.2011
Сообщений: 961
15.01.2017, 05:49  [ТС] 12
sad67man, это уже мелочи!
Но слово is из переменных уберу, сделать на совесть!

Добавлено через 2 минуты
Цитата Сообщение от sad67man Посмотреть сообщение
Стоит их переименовать на isNextHasNoClass
Ну или так сделаю.
0
2382 / 1386 / 655
Регистрация: 23.08.2015
Сообщений: 3,463
15.01.2017, 05:52 13
Raisin Zn, Кстати это общепринятое правило именования переменных типа boolean во всех языках программирования. Имя переменной должна указывать на то, что там лежит в том числе и тип. Здесь добавляя слово is мы как бы задаем вопрос "имеется класс?", а значение переменной возвращает ответ. Если переменная начитается на is, значит тип переменной boolean и возвращает true/false.
1
101 / 100 / 51
Регистрация: 19.04.2011
Сообщений: 961
15.01.2017, 05:58  [ТС] 14
Не знал, теперь буду знать...

Вот что получилось и как было раньше (сейчас все на своих местах, раньше картинки могли стоять в одной линии с текстом):
Миниатюры
Проверить наличие текста до и после элемента   Проверить наличие текста до и после элемента  
0
15.01.2017, 05:58
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
 15.01.2017, 05:58
Помогаю со студенческими работами здесь

Как проверить на существование элемента, после элемента input
У меня если поля input пустые - создается в js div.error с ошибкой. Как можно проверить на...

Проверить наличие текста в richTextBox
Как проверить все строки в richtextbox на наличие определенного текста? Например нужно искать текст...

Проверить наличие текста в TextBox
есть два текстбокса в которых вводятся числа int sum = Convert.ToInt32(textBox2.Text); int t_s...

Как проверить в Ls наличие текста в строке?
В @ есть @Like, а в LS аналогов найти не могу (((


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
14
Ответ Создать тему
КиберФорум - форум программистов, компьютерный форум, программирование
Поддержать - Реклама - Обратная связь
Powered by vBulletin
Copyright ©2000 - 2024, CyberForum.ru