Informações:
Autor: Ange Tuteur
Funcionalidade: Todas as Versões
Acesse:
E crie um novo Javascript em investimento nos tópicos com esse código:Painel de Controle ☛ Módulos ☛ HTML & Javascript ☛ Gestão dos códigos Javascript
- Código:
$(function() {
if (!document.getElementById('text_editor_textarea')) return; // no textarea ? better not continue :(
// definir dados globais para ser armazenada em cache e reutilizada
window.$fa_char = {
area : document.getElementById('text_editor_textarea'), // mensagem da caixa de mensagem
current : 0, // caracteres digitados atuais
maximum : /page_profil=signature/.test(window.location.search) ? 1000 : 60000, // caracteres máximo permitido
used : null, // cache de nó para caracteres usados
remain : null, // cache de nó para caracteres restantes
instance : null, // sceditor instance
// calcular os caracteres utilizados e restante
calculate : function() {
$fa_char.current = ($fa_char.instance ? $fa_char.instance.val() : $fa_char.area.value).length; // get the message length
$fa_char.used.innerHTML = $fa_char.current; // Atualiza a contagem atual
$fa_char.remain.innerHTML = '<span ' + ($fa_char.current >= $fa_char.maximum ? 'style="color:#F00"' : '') + '>' + ($fa_char.maximum - $fa_char.current) + '</span>'; // atualizar os caracteres restantes
}
};
var node = document.createElement('DIV'); // recipiente para os dados chararacter
node.id = 'faCharCounter'; // o ID é usado principalmente para estilos definidos pelo usuário
node.innerHTML = '<span id="faCharUsed">0</span> caracteres utilizados de ' + $fa_char.maximum + ' (<span id="faCharRemain" style="color:#090">' + $fa_char.maximum + '</span> restantes)'; // definir os nossos dados de caráter
$fa_char.area.parentNode.insertBefore(node, $fa_char.area); // inserir o recipiente antes da área de texto
// atualizar os caches nó de modo que não tem que continuo recebendo esses elementos
$fa_char.used = document.getElementById('faCharUsed');
$fa_char.remain = document.getElementById('faCharRemain');
// executar outro doc pronto para corresponder-se com o sceditor
$(function() {
// dependendo se o sceditor estiver presente, um destes eventos será ligado
if ($.sceditor) {
var container = $('.sceditor-container');
$fa_char.instance = $($fa_char.area).sceditor('instance');
$('textarea', container)[0].oninput = $fa_char.calculate; // source
$('iframe', container).contents()[0].body.oninput = $fa_char.calculate; // wysiwyg
} else $fa_char.area.oninput = $fa_char.calculate;
$fa_char.calculate(); // obter a contagem de caracteres atual no carregamento da página
});
});
Resultado: