2012-02-29 4 views
0

텍스트 상자가 있고 사용자가 키를 누를 때마다 필드의 새로운 길이를 계산하여 여전히 사용할 수있는 문자 수를 확인합니다. 는 그 수에 따라, I :변수가 값을 변경하기를 기다립니다.

  1. 확인 버튼을 사용하거나해야한다 "보내기"가 아닌 경우
  2. 체크 경우 (라 트위터 A) 길이가 빨간색이나 검은 색이어야한다 표시 카운터

하지만 지금은 문제가 있습니다. 각 를 keyDown 이벤트, 내가 할 :

remaining = 100 - count; 

if (remaining > 9) 
{ 
    //blue counter; send is activated 
    //"if counter.class == red then counter.class = blue..." 
    //"send.off('click'); send.on('click', sendmessage)..." 
} 
else if ((remaining <= 9) && (remaining >= 0)) 
{ 
    //red counter; send is activated 
} 
else //remaining <0 
{ 
    //red counter; send is deactivated 
} 

할 때마다 사용자가 키, 3 개 개의 진영 중 하나가 실행을 누르면 ...가 없습니다 거기 진영을 실행하는 방법 경우에만 변수 변경 "구역"(]∞, 9[; [9,0]; ]0; -∞[)?

+0

http://jsfiddle.net/ZAjez/ 어떻게 카운트가 0보다 작은 수 있는가? – nnnnnn

+0

내 나쁜, 사실은 남아 caracters의 수 (다시, 트위터처럼 140 한계) – Manu

+1

jQuery를 사용하고 계십니까? (나는'send.off (...)에 주목한다.) – nnnnnn

답변

1

이 더 우아 할 수 의심의 여지가 있지만, 간단한 대답은 길이의 이전 값을 기억하는 것입니다 값이 의미가

var prevCount = 10; 

function checkLength() { 
    var count = // your logic to get current count here 

    if (count > 9 && prevCount <=9) { 
     // count has changed to > 9 
    } else if (count <=9 && count >= 0 && (prevCount > 9 || prevCount < 0) { 
     // count has changed to <=9 
    } else if (count < 0 && prevCount >= 0) { 
     // count has changed to < 0 
    } 

    prevCount = count; 
} 

초기화 prevCount 무엇에을 때 화면로드 ...

(PS는 카운트가 0보다 작은 수있는 방법?)

업데이트 : 당신은 당신이 이런 일을 할 수있는 jQuery를 사용하는지 확인한 이후가 (가정 "블랙"과 "빨간색"스타일 시트의 클래스는 적절한 색상 및 서식 설정)에 있습니다 : 텍스트 나 너무 많은 텍스트 존재하지 않는 경우는

$(document).ready(function() { 
    var limit = 100, 
     $rem = $("#remaining").addClass("black"), 
     $send = $("input"); 

    $("textarea").on("keydown keyup", function() { 
     var len = $(this).val().length, 
      remaining = limit - len; 

     $rem.text(remaining); 
     $send.prop("disabled", len === 0 || remaining < 0); 

     if (remaining <=9 && $rem.hasClass("black") 
      || remaining > 9 && $rem.hasClass("red")) 
      $rem.toggleClass("black red"); 
    }).keydown(); 
});​ 

가 전송 버튼을 사용하지 않습니다; 필요한 경우에만 클래스를 검정색에서 빨간색으로 변경합니다. (당신은 또한 기본을 검정하고 단지와 떨어져 "빨간색"클래스를 전환 할 수 있습니다.)

데모 :

관련 문제