특정 요소 위로 마우스를 이동하지 않는 한 포커스 손실을 방지합니다.

Question

텍스트 영역이 #content이고 입력 텍스트 상자가 #name 인 페이지가 있습니다. 사용자가 #content을 클릭하면 #name을 클릭하지 않는 한 해당 텍스트 영역의 포커스를 잃지 않도록하고 싶습니다.

나는 다음 시도했다 :

그것은 요소의 초점의 손실을 방지하기 위해 잘 작동

// Prevent loss of focus for textarea 
$("#content").on("blur", function(event) { 
    $('#name').mouseover(function() { 
     return true; 
    }); 
    event.preventDefault(); 
    this.focus(); 
    return false; 
}); 

. 그러나 그가 #name을 유혹하고 돌아 오는 지 확인하는 아이디어는 효과가 없습니다.

Answer 1

http://jsfiddle.net/ugx3S/는 blur을 유발하는 요소를 얻을 수 here의 코드를 훔친.

var clicky; 

$(document).mousedown(function(e) { 
    // The latest element clicked 
    clicky = $(e.target); 
}); 

$("#content").on("blur", function(event) { 
    if (clicky.attr('id') == 'name') { 
     return true; 
    } 
    event.preventDefault(); 
    this.focus(); 
    return false; 
}); 

fiddle

호버가 그 순간에 발생 여부를 ("# 이름"). 마우스 오버 (함수() {})`테스트하지 않습니다`$, 그것은 것입니다 마우스 오버 핸들러를 결합

Answer 2

어쩌면 이렇게 될까요?

$(document).ready(function(){ 
    var id; 
    $('#content').on('blur',function(){ 
     $(":input").focus(function(){ 
      id = this.id; 
      if(id != 'username' && id != 'content'){ // sorry, changed your id from name to username. 
       $('#content').focus(); 
       } 
      });  
     }); 
    }); 

근무 바이올린 :