Javascript-форум (https://javascript.ru/forum/)
-   Events/DOM/Window (https://javascript.ru/forum/events/)
-   -   теги в выделенном фрагменте (https://javascript.ru/forum/events/30724-tegi-v-vydelennom-fragmente.html)

woojin 14.08.2012 15:29

ещё пример, в редакторе есть текст:::
<p><strong>Позиционные селекторы</strong><br />
Эти селекторы используются для выборки объектов на основе их положения по отношению к другим элементам, например на основе вложенности или наличия вложенных объектов, порядка следования в очереди (парные, не парные, первый элемент, последний элемент).</p>
<p>Выбор первого элемента:<br />
<span style="color: #333399;">$(«li:first»)</span> // здесь выбирается первый элемент &lt;li&gt;</p>
<p>Выбор последнего элемента:<br />
<span style="color: #333399;">$(«p:last»)</span> // здесь выбирается последний элемент p</p>
<p>Выбор каждого второго элемента начиная с 0 (индексация эллементов с нуля):<br />
<span style="color: #333399;">$(«p:even»)</span> // каждый второй параграф начиная с нулевого</p>
<p>Выбор каждого второго элемента начиная с первого:<br />
<span style="color: #333399;">$(«.mega-div:odd»)</span> // выбор каждого второго элемента с классом .mega-div начиная с первого (индексация с нуля)</p>

после выделения текста (к примеру от "элемент).</p>" и до "<p>Выбор каждого") и нажатия на кнопку добавления моих тегов, в редакторе текст должен выглядеть так:::
<p><strong>Позиционные селекторы</strong><br />
Эти селекторы используются для выборки объектов на основе их положения по отношению к другим элементам, например на основе вложенности или наличия вложенных объектов, порядка следования в очереди (парные, не парные, первый элемент, последний элемент).</p>
{spec}
<p>Выбор первого элемента:<br />
<span style="color: #333399;">$(«li:first»)</span> // здесь выбирается первый элемент &lt;li&gt;</p>
<p>Выбор последнего элемента:<br />
<span style="color: #333399;">$(«p:last»)</span> // здесь выбирается последний элемент p</p>
<p>Выбор каждого второго элемента начиная с 0 (индексация эллементов с нуля):<br />
<span style="color: #333399;">$(«p:even»)</span> // каждый второй параграф начиная с нулевого</p>
{/spec}
<p>Выбор каждого второго элемента начиная с первого:<br />
<span style="color: #333399;">$(«.mega-div:odd»)</span> // выбор каждого второго элемента с классом .mega-div начиная с первого (индексация с нуля)</p>

т.е. получается что скрипт перенёс начло выделения после закрывающегося </p> и перед открывающимся <p>? но не факто что там будут именно "P" там (в редакторе) могут быть и другие теги
а когда этот текст уже будет на странице сайта, то он будет выглядить вот так:::
<p><strong>Позиционные селекторы</strong><br />
Эти селекторы используются для выборки объектов на основе их положения по отношению к другим элементам, например на основе вложенности или наличия вложенных объектов, порядка следования в очереди (парные, не парные, первый элемент, последний элемент).</p>
<div>
для разблокировки и просмотра скрытого текста, пожалуйста авторизуйтесь
</div>
<p>Выбор каждого второго элемента начиная с первого:<br />
<span style="color: #333399;">$(«.mega-div:odd»)</span> // выбор каждого второго элемента с классом .mega-div начиная с первого (индексация с нуля)</p>


надеюсь так совсем понятно объяснил))))

woojin 14.08.2012 15:33

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

Aetae 14.08.2012 17:00

Так вы ничего не меняйте. Пусть люди вставляют {spec} теги как им вздумается, а правьте уже перед выводом(мой скрипт это подразумевал).
И вообще, не надо думать за пользователья - он всё равно сделает по своему.)

woojin 14.08.2012 17:16

дык как бы хочется чтобы пользователь, вообще сильно не думал

Deff 14.08.2012 17:22

woojin,
Собственно идея обрамлений несколько не так сформулированa:
Имхо так:
1. Выделенную подстроку считываем и ставим спецВыделения по началу концу выделенной строки и дополнительно и ищем теги и обрамляем все входящие в подстроку теги обратным спецвыделением

Пример
Выделили:
Цитата:

Позиционные селекторы</strong><br /> 
2	Эти селекторы используются для выборки объектов на основе их положения по отношению к другим элементам, например на основе вложенности или налич

Теперь обрамляем
Цитата:

{spec}Позиционные селекторы</strong><br />
2 Эти селекторы используются для выборки объектов на основе их положения по отношению к другим элементам, например на основе вложенности или налич{/spec}
Теперь делаем правильное обрамление
Цитата:

{spec}Позиционные селекторы{/spec}</strong>{spec}{/spec}<br /> {spec}
2 Эти селекторы используются для выборки объектов на основе их положения по отношению к другим элементам, например на основе вложенности или налич{/spec}
Теперь можно заменять на реальные теги - к примеру
<span style="color:red"> </span>

<span style="color:red">Позиционные селекторы</span></strong><span style="color:red"></span><br /> <span style="color:red">
2	Эти селекторы используются для выборки объектов на основе их положения по отношению к другим элементам, например на основе вложенности или налич</span>

Aetae 14.08.2012 17:24

Цитата:

Сообщение от woojin (Сообщение 197537)
дык как бы хочется чтобы пользователь, вообще сильно не думал

А он будет: "Почему, блеать, я выделяю от сих до сих, нажЫмаю кнопку, а он делает не так?! Сто раз пробовал!! Сломал клаву, мышь и разбил монитор!!! Ненавижу woojin'а!".)

woojin 14.08.2012 18:02

этот
Цитата:

{spec}Позиционные селекторы{/spec}</strong>{spec}{/spec}<br /> {spec}
2 Эти селекторы используются для выборки объектов на основе их положения по отношению к другим элементам, например на основе вложенности или налич{/spec}
вариант не правилен
т.к. должно получиться так:
Позиционные селекторы</strong>{spec}<br />
2	Эти селекторы используются для выборки объектов на основе их положения по отношению к другим элементам, например на основе вложенности или налич{/spec}

вот в таком варианте будет всё верно))))

woojin 14.08.2012 18:04

Цитата:

Сообщение от Aetae (Сообщение 197541)
А он будет: "Почему, блеать, я выделяю от сих до сих, нажЫмаю кнопку, а он делает не так?! Сто раз пробовал!! Сломал клаву, мышь и разбил монитор!!! Ненавижу woojin'а!".)

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

продвинутый и так поймёт что и куда ставить

woojin 14.08.2012 18:05

Цитата:

Сообщение от woojin (Сообщение 197483)
если уж не получается сделать так как мне нужно, то хотя бы можете дать примерчик, как определить есть ли в выделенном фрагменте не открытые и не закрытые стандартные теги и соответственно поставить после и перед ними мои спец. теги

так хотя бы подскажите как сделать

Deff 14.08.2012 18:05

woojin,
Имхо - мой вариант правильней - тем паче можно одеть в реальные HTML теги со спец Классом для каждого выделения - тогда считывая теги с данным классом получаем полную последовательную строку


Часовой пояс GMT +3, время: 15:59.