Ограничить количество символов в редакторе WYSIWYG (NicEdit) - PullRequest
Новая
       13

Ограничить количество символов в редакторе WYSIWYG (NicEdit)

6 голосов
/ 17 ноября 2011

У меня есть этот код jQuery: 

var char = 60;
    $("#counter").append("You have <strong>" + char + "</strong> char.");
    $("#StatusEntry").keyup(function () {
        if ($(this).val().length > char) {
            $(this).val($(this).val().substr(0, char));
        }
        var rest = char - $(this).val().length;
        $("#counter").html("You have <strong>" + rest + "</strong> char.");
        if (rest <= 10) {
            $("#counter").css("color", "#ff7777");
        }
        else {
            $("#counter").css("color", "#111111");
        }
    });

Работает отлично! Но если вместо val () у меня есть text (), это не сработает.

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

Зачем мне это нужно для текста? Потому что я использую плагин wysiwyg, и он конвертирует мою текстовую область в div.

Я пытаюсь с .stopPropagation, но он не работает .. пытаюсь вернуть false и ничего ...

Надеюсь на вашу помощь!

Ответы [ 3 ]

7 голосов
/ 17 ноября 2011

Если вам нужно использовать NicEdit, вы можете ограничить нажатия клавиш, привязав событие keyup / keydown к только что созданному div (оно не заменяет вашу текстовую область - она ​​добавляет div и скрывает вашу текстовую область): 

$("#StatusEntry").prev().keydown(function () {

Это работает, потому что вновь созданный div всегда предшествует текстовой области - так что это будет работать для нескольких редакторов.

Однако, как вы, похоже, указали в своих комментариях, может быть достаточно div divEditable - если он использует следующий метод: 

    var char = 60;
    $("#counter").append("You have <strong>" + char + "</strong> char.");
    $("#StatusEntry").keyup(function () {
        if ($(this).text().length > char) {
            $(this).text($(this).text().substr(1));
        }
        var rest = char - $(this).text().length;
        $("#counter").html("You have <strong>" + rest + "</strong> char.");
        if (rest <= 10) {
            $("#counter").css("color", "#ff7777");
        }
        else {
            $("#counter").css("color", "#111111");
        }
    });

Демо: http://jsfiddle.net/RjNuX/3

0 голосов
/ 05 ноября 2014 
var len = 40;    
$(".nicEdit-main").keydown(function () {
    if($(".nicEdit-main").html().length>len){
        var string = $('.nicEdit-main').html();
        $('.nicEdit-main').html(string.substring(0, len));
        placeCaretAtEnd($('.nicEdit-main').get(0));
    }
});

функция placeCaretAtEnd от здесь

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

Вы должны выбрать целевой элемент редактирования. 

$(".nicEdit-main").keyup(...

Если у вас несколько редакторов, это решение не будет работать.

...