2009-07-12 9 views
0

다른 문제가 있습니다. 내 페이지 중 하나에 간단한 상호 작용을 추가하기 위해 JQuery-1을 사용하고 있습니다. 간단히 말해, 페이지 오른쪽 상단에 검색 텍스트 상자가 있습니다 (document.ready) 단순히 텍스트 입력란에 "제품 검색"이라는 문구를 추가하는 inputHint() 함수를 호출합니다. 사용자가이 텍스트 상자를 클릭하면 다른 "hideHint()"함수를 호출하여 기본 "검색 제품"구문을 숨 깁니다. 마지막으로 사용자가 입력하지 않고 페이지의 다른 곳을 클릭하면 힌트가 다시 표시됩니다. 여기에 자바 스크립트 userd에의 한 조각입니다 :
Jquery 브라우저 호환성 문제는 무엇입니까?

$.fn.inputHint = function(options) { 
    options = $.extend({hintClass: 'hint'}, options || {}); 

    function showHint() {   
     if ($(this).val() == '') { 
     $(this).addClass(options.hintClass).val($(this).attr('accesskey'));    
     } 
     else{} 
    } 

    function removeHint() {  
     if ($(this).hasClass(options.hintClass)) $(this).removeClass(options.hintClass).val('');    
    } 

는 여기에서 document.ready 처리기 (또는 당신이 그것을 호출 할 수 있습니다 무엇이든) :

$(document).ready(function(){ 

/* Initialize hint*/      
    $(function() { 
    $('*[@accesskey]').inputHint(); 
    });});  

이 코드는 매력처럼 작동하도록 원하는 기능을 얻을 수 Chrome 및 Safari에서만 가능합니다. IE와 파이어 폭스 모두 매우 유창한 행동을한다. (힌트는 잘 작동하지만, 페이지를 다시로드하면 마술처럼 멈춘다!). 내 코드가 이런 행동에 책임이 있습니까? 아니면 JQuery 자체에 문제가 있습니까? (저는 항상 JQuery가 모든 주요 브라우저와 호환된다는 말을 들었습니다.) 아이디어!?
PS : 그것은 당신의 준비 기능에 이미 같은이 JQuery와-1이 긴 샷의 비트 수 있습니다

+0

는 무엇입니까 :이 시도? "jQuery 1.3.2"와 다른 점이 있습니까? (공식 jQuery 라이브러리의 현재 릴리스) –

+0

예 JQuery 1.0이라고 생각합니다. 실제로 우리 팀의 디자이너 중 한 명은 처음부터 그것을 사용하고있었습니다. jQuery 1.3.2로 대체해야합니까? 한 단어로 – Galilyou

+0

, 예! – redsquare

답변

2

입니다) $ 함수 (에서 inputHint()에 대한 호출을 래핑 할 필요가 없다 . "JQuery와-1"당신이 당신의 힌트를 저장하는 accesskey 속성을 사용하는 이유를 잘 모르겠어요

$(document).ready(function(){ 
    /* Initialize hint*/ 
    $('*[@accesskey]').inputHint();  
}); 
2

하지만, 어쨌든 ...

$.fn.inputHint = function(options) { 
    options = $.extend({ hintClass: 'hint' }, options || {}); 

    $this = $(this); 
    hintValue = $this.attr("accesskey"); 

    function showHint() { 
     if ($this.val() == "") { 
      $this.addClass(options.hintClass).val(hintValue); 
     } 
    } 

    function removeHint() { 
     if ($this.hasClass(options.hintClass)) { 
      $this.removeClass(options.hintClass).val(""); 
     } 
    } 

    $this.blur(showHint) 
     .focus(removeHint) 
     .addClass(options.hintClass) 
     .val(hintValue); 
};