Обрезания текста

@Tregan · Регистрация: 25.07.2010

Студворк — интернет-сервис помощи студентам

Добрый день столкнулся с такой проблемой. Не знаю как это сделать может поможете.

Дан блок блоку дан фиксированный размер. в этом блоке идет текст. в блоке вмешается например 50символов текста. сам вопрос как сделать так чтобы текст который бы превышал 50символов. не начил расширять сам блок или переносить на другую строку текст.

Гдето видел что решили эту проблему с помощью троеточием. тоесть идет текст и доходя до границы блока начинает отображаться троеточием тем самым говоря что есть продолжения текста. как это можно воплотить в жизнь с помощью css. Или както по дргому?.

Если можно по конкретний расписать код ато не сильно понимаю как обротится именно к определенному <p> в html коде. За рания спасибо.

HTML5
1
2
3
<html>
<P>тЕКС ТЕКС тЕКС ТЕКС тЕКС ТЕКС тЕКС ТЕКС </P>
</html>

За рание спасибо.

Vovan-VE · 25.07.2010, 14:19

В CSS есть атрибут text-overflow, но он еще не всеми поддерживается (зато поддерживается в IE6 О_о). Есть простой overflow.

HTML5
1
<div class="tx">тЕКС ТЕКС тЕКС ТЕКС тЕКС ТЕКС тЕКС ТЕКС </div>

CSS
1
.tx {width:200px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden;}

@Tregan · 25.07.2010, 14:25 **[ТС]**

А возможно ли это с помощью Java script воплотить в жизнь?

Vovan-VE · 25.07.2010, 14:28

Сообщение от Tregan

А возможно ли это с помощью Java script воплотить в жизнь?

Предлагаете просто удалить лишние буквы?

@Tregan · 25.07.2010, 14:47 **[ТС]**

чтобы с рабатывало правило в js. при привышении 50 символов удалялись последнии три буквы и заменялись троеточием. Как то так (.

Не знаю просто как это в коде написать((

Vovan-VE · 25.07.2010, 14:51

JavaScript
1
2
var s = 'многобуков';
if (s.length > 50) s = s.substr(0, 47) + '...';

@Tregan · 25.07.2010, 14:59 **[ТС]**

О спасибо. и исче такая мелочь а как именно это правило присвоить к определенному тегу <p>?

Vovan-VE · 25.07.2010, 15:05

HTML5
1
2
3
4
5
<p id="idtext">...</p>
<script type="text/javascript">
var a = document.getElementById('idtext');
if (a && a.innerHTML.length > 50) a.innerHTML = a.innerHTML.substr(0, 50) + '...';
</script>

@Tregan · 25.07.2010, 16:32 **[ТС]**

Сделал как написали, но эфекта ноль

Я в js очень плохо разбираюсь если можно то у кажите на ошибки более точно, и как их решить тоже.

Vovan-VE · 25.07.2010, 16:46

Сообщение от Tregan

Сделал как написали

Нет, не так

Надо, чтобы данный <script> был ниже данного <p>

HTML5
1
2
<p>...</p>
<script>...</script>

@Tregan · 25.07.2010, 16:58 **[ТС]**

Перенес ниже. эфект такой жеть нечего не изменилось ((((

Vovan-VE · 25.07.2010, 17:04

if (a && a.innerHTML > 50)

Ошибка. Надо

JavaScript
1
if (a && a.innerHTML.length > 50)

@Tregan · 25.07.2010, 17:21 **[ТС]**

Спасибо получилось. только он теперь весь текс заменил троеточием

. А как надо чтобы последнии три символа он заменял троеточием?

Vovan-VE · 25.07.2010, 17:40

Только три последних? О_о Запросто, но есть ли в этом смысл?

JavaScript
1
2
...
... a.innerHTML = a.innerHTML.substr(0, a.innerHTML.length - 3) + '...';

@Tregan · 25.07.2010, 17:54 **[ТС]**

Я наверное не правильно обьяснил суть проблемы. Надо чтобы Если блок привышает больше 50 символов: например текста 150символов. то чтобы текст обрезался на первыйх 50 символах. Тоетсть первые 50 символов ведны. и после них идет троеточие говаря тем самым что дальше текст есть.
Вот пример
Название: 47386996.jpg
Просмотров: 165

Размер: 84.0 Кб

Название: 47386996.jpg
Просмотров: 165

Размер: 84.0 Кб

Vovan-VE · 25.07.2010, 18:02

Сообщение от Tregan

Если блок привышает больше 50 символов... то чтобы текст обрезался на первыйх 50 символах

Ведь так и было

JavaScript
1
2
3
4
5
<p id="idtext">...</p>
<script type="text/javascript">
var a = document.getElementById('idtext');
if (a && a.innerHTML.length > 50) a.innerHTML = a.innerHTML.substr(0, 50) + '...';
</script>

Добавлено через 1 минуту

Сообщение от Vovan-VE

JavaScript
1
a.innerHTML.substr(0, 50) + '...'

Так тут 47 т.е. надо?

@Tregan · 25.07.2010, 18:09 **[ТС]**

[QUOTE=Vovan-VE;874154]Ведь так и было

JavaScript
1
2
3
4
5
<p id="idtext">...</p>
<script type="text/javascript">
var a = document.getElementById('idtext');
if (a && a.innerHTML.length > 50) a.innerHTML = a.innerHTML.substr(0, 50) + '...';
</script>

Этот код полностью заменяет мне весть текст,, замисть текста только троеточие

Комментарий модератора

Прикрепляйте изображения к сообщению. https://www.cyberforum.ru/abou... post594251

@Tregan · 25.07.2010, 18:28 **[ТС]**

Так в чем может быть проблема подскажеш? Vovan-VE,

Vovan-VE · 25.07.2010, 18:29

У Вас Internet Explorer? Что-то его прёт с этим кодом.

@Tregan · 25.07.2010, 18:32 **[ТС]**

Нет смотрю в FireFox. и В Opera тоже самое((

Новые блоги и статьи Все статьи Все блоги /
Знаешь почему 90% людей редко бывают счастливыми? kumehtar 14.04.2026 Потому что они ждут. Ждут выходных, ждут отпуска, ждут удачного момента. . . а удачный момент так и не приходит.	Фиксация колонок в отчете СКД Maks 14.04.2026 Фиксация колонок в СКД отчета типа Таблица. Задача: зафиксировать три левых колонки в отчете. Процедура ПриКомпоновкеРезультата(ДокументРезультат, ДанныеРасшифровки, СтандартнаяОбработка) / / . . .	Настройки VS Code Loafer 13.04.2026 { "cmake. configureOnOpen": false, "diffEditor. ignoreTrimWhitespace": true, "editor. guides. bracketPairs": "active", "extensions. ignoreRecommendations": true, . . .	Оптимизация кода на разграничение прав доступа к элементам формы Maks 13.04.2026 Алгоритм из решения ниже реализован на нетиповом документе, разработанного в конфигурации КА2. Задачи, как таковой, поставлено не было, проделанное ниже исключительно моя инициатива. Было так:. . .
Контроль заполнения и очистка дат в зависимости от значения перечислений Maks 12.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: реализовать контроль корректности заполнения дат назначения. . .	Архитектура слоя интернета для сервера-слоя. Hrethgir 11.04.2026 В продолжение https:/ / www. cyberforum. ru/ blogs/ 223907/ 10860. html Знаешь что я подумал? Раз мы все источники пишем в голове ветки, то ничего не мешает добавить в голову такой источник, который сам. . .	Подстановка значения реквизита справочника в табличную часть документа Maks 10.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеПерсонала", разработанного в конфигурации КА2. Задача: при выборе сотрудника (справочник Сотрудники) в ТЧ документа. . .	Очистка реквизитов документа при копировании Maks 09.04.2026 Алгоритм из решения ниже применим как для типовых, так и для нетиповых документов на самых различных конфигурациях. Задача: при копировании документа очищать определенные реквизиты и табличную. . .

@Tregan 0 / 0 / 0 Регистрация: 25.07.2010 Сообщений: 18
	25.07.2010, 14:25 [ТС]
	А возможно ли это с помощью Java script воплотить в жизнь? 0

@Tregan 0 / 0 / 0 Регистрация: 25.07.2010 Сообщений: 18
	25.07.2010, 14:47 [ТС]
	чтобы с рабатывало правило в js. при привышении 50 символов удалялись последнии три буквы и заменялись троеточием. Как то так (. Не знаю просто как это в коде написать(( 0

@Tregan 0 / 0 / 0 Регистрация: 25.07.2010 Сообщений: 18
	25.07.2010, 14:59 [ТС]
	О спасибо. и исче такая мелочь а как именно это правило присвоить к определенному тегу <p>? 0

@Tregan 0 / 0 / 0 Регистрация: 25.07.2010 Сообщений: 18
	25.07.2010, 16:32 [ТС]
	Сделал как написали, но эфекта ноль Я в js очень плохо разбираюсь если можно то у кажите на ошибки более точно, и как их решить тоже. Миниатюры 0

@Tregan 0 / 0 / 0 Регистрация: 25.07.2010 Сообщений: 18
	25.07.2010, 16:58 [ТС]
	Перенес ниже. эфект такой жеть нечего не изменилось (((( 0

@Tregan 0 / 0 / 0 Регистрация: 25.07.2010 Сообщений: 18
	25.07.2010, 17:21 [ТС]
	Спасибо получилось. только он теперь весь текс заменил троеточием . А как надо чтобы последнии три символа он заменял троеточием? 0

@Tregan 0 / 0 / 0 Регистрация: 25.07.2010 Сообщений: 18
	25.07.2010, 17:54 [ТС]
	Я наверное не правильно обьяснил суть проблемы. Надо чтобы Если блок привышает больше 50 символов: например текста 150символов. то чтобы текст обрезался на первыйх 50 символах. Тоетсть первые 50 символов ведны. и после них идет троеточие говаря тем самым что дальше текст есть. Вот пример 0

@Tregan 0 / 0 / 0 Регистрация: 25.07.2010 Сообщений: 18
	25.07.2010, 18:28 [ТС]
	Так в чем может быть проблема подскажеш? Vovan-VE, 0

Vovan-VE 13210 / 6599 / 1041 Регистрация: 10.01.2008 Сообщений: 15,069
	25.07.2010, 18:29
	У Вас Internet Explorer? Что-то его прёт с этим кодом. 0

@Tregan 0 / 0 / 0 Регистрация: 25.07.2010 Сообщений: 18
	25.07.2010, 18:32 [ТС]
	Нет смотрю в FireFox. и В Opera тоже самое(( 0