Javascript-форум (https://javascript.ru/forum/)
-   jQuery (https://javascript.ru/forum/jquery/)
-   -   BBcode Editor - функция не стреляет (https://javascript.ru/forum/jquery/30645-bbcode-editor-funkciya-ne-strelyaet.html)

Freakmeister 10.08.2012 17:58

BBcode Editor - функция не стреляет
 
Пытаюсь сделать самый простой редактор бб-кода, без использования увесистых библиотек. Типа того, что используется на этом форуме. Кнопками у меня служат картинки вида: <img src="blabla" alt="b">
А функция вызывается по клику:

$('.portal-bbcodes img:not(.smilies)').click(function() {
    var textArea = $('.portal-bbcodes + textarea');
    var n = $(this).attr('alt');
    insertTag(textArea, '['+n+']', '[/'+n+']');
});

Нашёл идеально работающую штуку в виде плагина (в архиве есть демо): http://code.google.com/p/jquery-bbedit/downloads/list
Короче, я решил вытащить из него самую суть и немного "оприходовать" входящие данные, чтобы упростить по максимуму и заставить работать с моими кнопками:

function insertTag(ta, tag, tag2) { //изменено: data на ta
        var val, startPos, endPos;
        var range = document.selection.createRange(); //изменено: data.range на document.selection.createRange();
        var text = '';
        var highlight = false; //добавлено
        if (range != null) {
            text = range.text;
        } else if (typeof ta.selectionStart != 'undefined') {
            startPos = ta.selectionStart;
            endPos = ta.selectionEnd;
            text = ta.value.substring(startPos, endPos);
        }
        if (typeof tag == 'function' || typeof tag == 'object') {
            val = tag(text);
            if (val === false) {
                if (range != null) {
                    range.moveStart('character', text.length);
                    range.select();
                } else if (typeof ta.selectionStart != 'undefined') {
                    ta.selectionStart = startPos + text.length;
                }
                ta.focus();
                return;
            }
        } else {
            if (!tag2 || tag2 == '') {
                val = text + tag;
            } else {
                val = tag + text + tag2;
            }
        }
        if (range != null) {
            range.text = val;
            if (highlight) { // изменено: data.highlight на highlight
                range.moveStart('character', - val.length);
            } else {
                range.moveStart('character', 0);
            }
            range.select();
        } else if (typeof ta.selectionStart != 'undefined') {
            ta.value = ta.value.substring(0, startPos) + val + ta.value.substr(endPos);
            if (highlight) { // изменено: data.highlight на highlight
                ta.selectionStart = startPos;
                ta.selectionEnd = startPos + val.length;
            } else {
                ta.selectionStart = startPos + val.length;
                ta.selectionEnd = startPos + val.length;
            }
        } else {
            ta.value += val;
        }
        ta.focus();
    }

Проблема в том, что функция не работает, и я не пойму почему. Она ведь прекрасно работает в плагине и ошибок при изменении я вроде не допустил, поэтому я сейчас просто в ступоре... Я уже пробовал сувать её и в (function ($) { })(jQuery); и в $(document).ready(function() { }); - безрезультатно. С моей стороны тут наверняка допущена какая-то наитупейшая ошибка, которую я просто не вижу в силу неопытности. Прошу помощи. =\

Freakmeister 10.08.2012 18:22

Сейчас попробовал вытащить функцию из ещё одного эдитора, с некоторыми недостатками, но более простого - и эта функция не стреляет... :blink:

function insertTag(element, start, end) { //изменён порядок параметров
    if (document.selection) {
       element.focus();
       sel = document.selection.createRange();
       sel.text = start + sel.text + end;
    } else if (element.selectionStart || element.selectionStart == '0') {
       element.focus();
       var startPos = element.selectionStart;
       var endPos = element.selectionEnd;
       element.value = element.value.substring(0, startPos) + start + element.value.substring(startPos, endPos) + end + element.value.substring(endPos, element.value.length);
    } else {
      element.value += start + end;
    }
  }

Deff 10.08.2012 19:06

Freakmeister,
Где то есть длинно код -универсальной функции с PUNBB-я давал, - мне лениво искать ...
Хотя щас вобъю типо createRange http://javascript.ru/forum/css-html-...tml#post185398 пост 2

Freakmeister 10.08.2012 20:44

Попробовал твой код. Эффект тот же, что при использовании кода от phpBB - при нажатии кнопки, код в textarea мигает, т.е. focus где-то срабатывает, но обвёртывание тэгами не происходит. Я может совсем дурак, или уже в конец рехнулся, но сейчас задам наиглупейший вопрос - куда этот код вставлять? Понятно, что в подключаемый скрипт, после подключения jQuery. Но нужно ли обёртывать эти функции чем-нибудь? document.ready например... Хотя оно один фиг не работает.

Deff 10.08.2012 22:19

Freakmeister, вот этот скрипт работающий в форме ответа
http://hostjs-mybb2011.narod.ru/SmiliesBoxes2.htm ( там иконки в верхней части теxtarea

Freakmeister 10.08.2012 23:30

Ну вот а у меня оно не работает.) Пробовал даже все остальные скрипты кроме jQuery отключать, чтобы небыло никаких конфликтов. В общем, Мухамед не пошёл к горе, и я решил сделать всё наоборот - переделал функцию в плагин, а не плагин в функцию. Не очень красивый код получился, но работает.)


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