Jquery щебетать как счетчик символов смещения для сокращенных ссылок - PullRequest
Новая
       38

Jquery щебетать как счетчик символов смещения для сокращенных ссылок

4 голосов
/ 29 ноября 2011

Здравствуйте, я пытаюсь имитировать счетчик символов в твиттере.Поэтому при вводе или вставке ограничение уменьшается.Но служба, для которой я пишу это, также будет иметь сокращенный URL-адрес, поэтому я хочу сместить его на количество символов, которое будет в конечном URL.Сокращение происходит в конце публикации, а не при вводе URL.

У меня почти все работает, но когда я щелкаю элемент, смещение больше не существует, и счетчик символов возвращается к тому, что было бы, если бы ссылки были полной длины.Я полагаю, что это потому, что я использую метод .change (), а не .bind («вставка ввода»), но ввод вставки не применял смещение. 

/* Character Count for Posts */                
function checkPostForURL(post){
    var matches = [],
        urlexp = new RegExp("(^|[ \t\r\n])((http|https):(([A-Za-z0-9$_.+!*(),;/?:@&~=-])|%[A-Fa-f0-9]{2}){2,}(#([a-zA-Z0-9][a-zA-Z0-9$_.+!*(),;/?:@&~=%-]*))?([A-Za-z0-9$_+!*();/?:~-]))","g"),
        $linkShort = $('#linkstoshort'),
        matchIdx = 0;

    if ( post !== undefined ){
        if ( urlexp.test(post) ){
               var offset = 0;
               $('.shortenlinks').show();
               matches = post.match(urlexp);

               $linkShort.html('');

                for(; matchIdx < matches.length; matchIdx++) {
                    var match = matches[matchIdx],
                        matchOffset = match.length - 23;

                    offset += matchOffset;

                    $linkShort.append('<li>'+match+'</li>');
                }

                return offset;
        }
    }
 }

$(function(){
    var $postMsg = $('#post-msg'),
        message = $postMsg.text(),
        twstartchars = 140 - message.length,
        fbstartchars = 420 - message.length,
        $fbCount = $("#fb-char"),
        $twCount = $("#tw-char"),
        setRemainingChars = function (evt) {
            var a = $postMsg.val().length,
                post = $postMsg.val();        

            var offset = checkPostForURL(post);
            if ( offset ){
                a = a - offset;
            }

            $fbCount.text((420-a));
            $twCount.text((140-a));
            if ( a > 120 ){
                    $fbCount.css('color','red');
                    if ( a > 380 ){
                            $fbCount.css('color','red');
                    }
            }else{
                    $fbCount.css('color','#333');
                    $twCount.css('color','#333');
            }
        };

    $fbCount.text(fbstartchars);
    $twCount.text(twstartchars);

    $postMsg.on('keypress change', setRemainingChars);
});

ОБНОВЛЕНИЕ: Я сделал скрипту JS длялучше покажи, что я пытаюсь сделать http://jsfiddle.net/FUADn/384/

1 Ответ

0 голосов
/ 29 ноября 2011

Вы пытались привязать событие .keyup () к входу вместо события изменения? Технически это должно работать и сохранять привязку после использования мачты и т. Д.

...