Форум

woojin · #1 (**permalink**) 13.08.2012, 16:31

приветствую!!!

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

пример::: выделение начинается после "текст2" и заканчивается после "текст6"

<p>текст1
<span>текст2
{spec}
</span>
<p>текст3</p>
<p>текст4</p>
<p>текст5</p>
<span>текст6
{/spec}
</span>
текст7
</p>

вот так вот не надо что бы было
надо что бы было так:::

<p>текст1
<span>текст2</span>
{spec}
<p>текст3</p>
<p>текст4</p>
<p>текст5</p>
{/spec}
<span>текст6</span>
текст7
</p>

и по этому поводу вопрос::: как сделать так что бы скрипт обработал текст как во втором примере

извините но я не знаю вообще как это сделать так что думаю что вы предложите какой то вариант
заранее спасибо

P.S. теги могут быть абсолютно разными, не обязательно SPAN и P

Deff · #2 (**permalink**) 13.08.2012, 16:36

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

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

Пример - это строка текста ? или её еще нужно извлечь из DOM ?

woojin · #3 (**permalink**) 13.08.2012, 17:56

нужно что бы скрипт срабатывал как в примере 2 и при этом ничего из DOM не надо
просто если получится как в примере 1 то поле отображения такой страницы на экране (всё между тегами {spec} заменяется на другой блок) может получится глюк а HTML структуре страницы
так и нужно чтобы была правильная вставка, которая в последствии не будет портить DOM

woojin · #4 (**permalink**) 13.08.2012, 17:57

забыл написать, обёртывание делаю вот такой функцией:::

(function($) {
  $.fn.wrapSelected = function(open, close) {
    return this.each(function() {
      var textarea = $(this);
      var value = textarea.val();
      var start = textarea[0].selectionStart;
      var end = textarea[0].selectionEnd;
      textarea.val(
        value.substr(0, start) + 
        open + value.substring(start, end) + close + 
        value.substring(end, value.length)
      );
    });
  };
})(jQuery);

woojin · #5 (**permalink**) 13.08.2012, 23:28

вот что выдал этот пример:::

<p>текст1
<span>текст2 </span>
{spec}
</p><p>текст3</p>
<p>текст4</p>
<p>текст5</p>
<span>текст6 </span>
{/spec}
текст7
<p></p>

перенос сработал отлично почти так как и хотелось, если бы не закрывающий после открывающего {spec} и не открывающий после "текст7"
может поможете исправить эту ошибку, я в рег.експах вообще ни фига не понимаю((((

woojin · #6 (**permalink**) 14.08.2012, 00:02

извините что непонятно, объяснил, попробую ещё раз:::
нужно чтобы выделенный текст оборачивался неким спец тегом ({spec}и{/spec}), но таким образом что бы открывающий и закрывающий спец теги не находились внутри других тегов, т.е. чтобы они к примеру не резали теги <div>, , , <ul> и т.д.
это нужно сделать для того чтобы в последствии обёрнутый участок текста то же был заменён, на некоторый текст (но это уже при отображении самой страницы)
в то же время {spec}и{/spec} могут находиться внутри <div>, , , <ul> и т.д.

так понятно?

Deff · #7 (**permalink**) 14.08.2012, 00:08

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

так понятно?

Так точно товарищь - задачка однако не из простых - думал только из span вынуть

Deff · #8 (**permalink**) 14.08.2012, 01:27

Дзен-трансгуманист,
Туть при данной постановке задачи - рекурсия не слабая -

Воть мой предыдущий код

<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>






<div id=div></div>

<script type="text/javascript">
var str='\
<div>текст1\n\
<span>текст2\n\
{spec}\n\
</span>\n\
<p>текст3</p>\n\
<p>текст4</p>\n\
<p>текст5</p>\n\
<span>текст6\n\
{/spec}\n\
</span>\n\
текст7\n\
</div>';

alert(str)

function Replac(str) {
  var a = document.getElementById( 'div' );

  $(a).append(str);

  var c=$(a).find("span").each(function() {
     var b = $(this).html();//alert('b='+b)
     if(b.indexOf('spec}')!=-1){ //alert(b)

	b = b.replace(/\s*(\{\/?spec\})\s*/ig,' ');
	$(this).text(b);
	$(this).after('\n'+RegExp["$1"]);
alert($(a).html())
     }

}); return $(a).html()}

alert(Replac(str))
</script>

Вынимал из span и переставлял за ним
А тут нужно смотреть оба тега - в одном ли теге - если нет то....
Вдобавок обёртка тегов в теги (в исходной строке) - некоректна - при любой перестановке - Dom нарушается (а не div, как Выше

<script type="text/javascript" src="http://yandex.st/jquery/1.4.4/jquery.min.js"></script>






<div id=div></div>

<script type="text/javascript">
var str='\
<p>текст1\n\
<span>текст2\n\
{spec}\n\
</span>\n\
<p>текст3</p>\n\
<p>текст4</p>\n\
<p>текст5</p>\n\
<span>текст6\n\
{/spec}\n\
</span>\n\
текст7\n\
</p>';

alert(str)

function Replac(str) {
  var a = document.getElementById( 'div' );

  $(a).append(str);

  var c=$(a).find("span").each(function() {
     var b = $(this).html();//alert('b='+b)
     if(b.indexOf('spec}')!=-1){ //alert(b)

	b = b.replace(/\s*(\{\/?spec\})\s*/ig,' ');
	$(this).text(b);
	$(this).after('\n'+RegExp["$1"]);
alert($(a).html())
     }

}); return $(a).html()}

alert(Replac(str))
</script>

(Причём в Опере и Мозилле - траблы слегка разняться

Aetae · #9 (**permalink**) 14.08.2012, 10:48

Тк

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

(всё между тегами {spec} заменяется на другой блок

проще как-то так:

var str='\
<div>текст1\n\
<span>текст2\n\
{spec}\n\
</span>\n\
<p>текст3</p>\n\
<p>текст4</p>\n\
<p>текст5</p>\n\
<span>текст6\n\
{/spec}\n\
</span>\n\
текст7\n\
</div>';

alert(str)
function spec( str ){
	str = str.split(/\{\/?spec\}/);

	str[1] = str[1]
				.replace(/[^<>]+(?=<|$)/g,'')
				.replace(/<(\w+)[^>]*>[\s\S]*<\/\1>/g,'')
	split = str[1].search(/<\w+[^>]*>/)
	return [ 
		str[0] + str[1].substring(0,split),
		str[1].substring(split) + str[2]
	]
}

result = spec(str);
alert(result[0] + '\n{spec}\n{/spec}\n'+result[1])

woojin · #10 (**permalink**) 14.08.2012, 15:03

последний пример вот что выдал

<p>текст1
<span>текст2
</span>
{spec}
{/spec}
<span>
</span>
текст7
</p>

исчезли и которые были между {spec} и {/spec}

может быть поможет ещё одно пояснение::: эта штука должны срабатывать в редакторе текста в админке сайта
и просто оборачивать какой то выделенный фрагмент
затем когда страница во фронт енде отображается, то плагин производит подмену текста между спец тегами
это получается типа блокировки контента до авторизации пользователя, конечно можно всё сделать и на PHP но тогда потребуется перазгрузка страницы, что не приемлимо
хочется чтоб контент разблокировался сразу, без перезагрузки

Форум

Справочник

Discord чат

Курсы javascript