2013-05-04 3 views
2

그래서 html5 '자리 표시 자'속성 기능을 복제하려고합니다.포커스에서 '캐럿'점프를 방지합니다.

현재 내가 붙어있는 한 가지는 요소 입력에 따라 입력의 시작 부분에 즉시 나타나는 캐럿입니다.

캐럿은 사용자가 클릭 한 다음 jQuery를 사용하여 이동할 때 처음으로 이동하는 위치에 나타납니다.

여기를보십시오 : http://www.dollmode.com/test - "원하는 사용자 이름"필드를 클릭하면 무슨 뜻인지 알 수 있습니다.

해결 방법은 무엇입니까?

편집 내가 입력 한 하나의 아이디어는 텍스트 또는 다른 입력 위에 빈 입력을 배치하는 것입니다. 이렇게하면 사용자가 빈 입력을 입력 할 때 배경의 텍스트를 선택할 수없고 빈 입력에 텍스트를 입력 할 때 숨길 수 있습니다. 이것을하기 위해 크로스 브라우저 (ie6으로 돌아 가기)가 있습니까?

+0

에 위치하고 존재하지 않는? – adeneo

+0

그럴 겁니다, 저는 여전히 그것에 대해 연구 중입니다 ...이 작은 플러그인을 개발하는이 단계에서 저는 캐럿 문제에 머물러 있습니다. ( –

+0

빈 입력을 맨 위에 놓는 것이 하나의 아이디어였습니다. 이렇게하면 사용자가 빈 입력을 입력 할 때 배경에있는 텍스트를 선택할 수없고 빈 입력에 텍스트를 입력 할 때 숨길 수 있습니다. –

답변

0

는 I는 <span> 생성 절대적 상대적 위치 <input> 뒤에 위치. 그것은 일종의 일로 보입니다. 정렬은 브라우저에서 완벽하지는 않지만 자바 스크립트로 보완됩니다. 이는 훌륭한 크로스 브라우저 솔루션으로 작동합니다. IE6 +, Chrome, Opera 및 FF에서 작업 중입니다.

원하는 경우 여기에서 어떻게 작동하는지 확인하십시오!

http://www.dollmode.com/test 당신은이 질문을보고있는 경우 그 페이지는, 아마 지금 당신은 아마 초점에 자리를 제거해야 http://www.dollmode.com/

0

1.You는 그렇다면 텍스트 상자는 지정해야 비어가

$("input[type=text]").focus(function(){ 
    $(this).val(''); 
}); 

2.Then 집중됩니다 때 초점은 사용자가 텍스트 상자를 작성 여부를 확인해야 손실 될 때 텍스트 상자 내에서 텍스트를 제거해야 그 자리 값

$("input[type=text]").blur(function(){ 
    if($(this).val()=='') 
      $(this).val()= $(this).attr('title');   
}); 
+0

그 방법은 자리 표시 자 작동 방식입니다. HTML5는 아닙니다. 여기에서 찾으십시오. http://webdesignerwall.com/demo/html5-placeholder-text/ 그게 목표입니다. –