변경하지 않을 때 포커스가 선택되지 않음

Question

입력 상자가 포커스를 받으면 입력 상자를 선택 목록으로 바꾸려고합니다. 아무 것도 변경되지 않으면 이전 값으로 되돌립니다.

모두 예상대로 작동하지만 입력 상자에 초점을 맞춘 다음 포커스 아웃 이벤트 바깥 쪽을 클릭하면 해고되지 않습니다.

이것은 의도적으로 설계 되었습니까? 아니면 뭔가 잘못하고 있습니까?

html로 :

<div id=test> 
    <input type=text class=edit value=3 > 
    <input type=hidden class=temps> 
</div>​ 

그리고 스크립트 :

$(function(){ 
    editfocus();  
    editout();    
}); 

function editfocus(){  
    $('.edit').unbind('focusin'); 
    $('.edit').bind('focusin', function() { 
    console.log(this); 
    var previous = this.value; 
    $(this).siblings('.temps').val(previous); 
    parentid=$(this).parent()[0].id; 
    $('#'+parentid).children('.edit').replaceWith('<select class="edit listme" ><option value=1 >one</option><option value=2 >two</option></select>'); 
     editout(); 
    }); 
} 
function editout(){ 
    $('.edit').unbind('focusout'); 
    $('.edit').bind('focusout', function() { 
     parentid=$(this).parent()[0].id; 
     oldval=$(this).siblings('.temps').val(); 
     $('#'+parentid).children('.edit').replaceWith('<input type=text class=edit value="'+oldval+'" />'); 
     editfocus(); 
    }); 
} ​ 

이 jsfiddle 참조하십시오 http://jsfiddle.net/mandropil/f9jN3/

Answer 1

이 쉽게 수동으로 후 선택 요소를 국한 해결할 수 있습니다을 텍스트 입력을 바꿨습니다.

그래서 editfocus() 기능에 editOut(), 단순히 배치하기 전에 :

$('select').focus();