jqueryのタイトルは...私はタイルを選択するために、ワン

Question

編集できますが他を編集し、私は私は申し訳ありませんがたくさん欠けている知っている

をしたい内容を入力できるようにするには、他のとドロップダウン

http://jsfiddle.net/Rjqy5/57/

タイトル

氏

夫人

ミス

女史

その他

Answer 1

$(document).ready(function() { 
      $('.dropdown').live('mouseenter', function() { 
       $('.sublinks').stop(false, true).hide(); 

       var submenu = $(this).parent().next(); 

       submenu.css({ 
        position: 'absolute', 
        top: $(this).offset().top + $(this).height() + 'px', 
        left: $(this).offset().left + 'px', 
        zIndex: 1000 
       }); 

       submenu.stop().slideDown(300); 

       submenu.mouseleave(function() { 
        $(this).slideUp(300); 

        $('a#other').focus(function() { 
         $('#change').blur(); 
        }); 
       }); 
      }); 

      $('#tbOthers').live('keypress focusout', function (e) { 
       var textTitle = $.trim($(this).val()); 
       if (e.type === 'keypress') { 
        if ((e.keyCode ? e.keyCode : e.which) === 13) { 
         if (textTitle.length === 0) { 
          $(this).replaceWith('<a href="#" class="dropdown" id="change">Title</a>'); 
         } 
         else { 
          $(this).replaceWith('<a href="#" class="dropdown" id="change">' + textTitle + '</a>'); 
         } 
        } 
       } else if (e.type === 'keypress') { 
        if (textTitle.length === 0) { 
         $(this).replaceWith('<a href="#" class="dropdown" id="change">Title</a>'); 
        } 
        else { 
         $(this).replaceWith('<a href="#" class="dropdown" id="change">' + textTitle + '</a>'); 
        } 
       } 
      }); 

      $('#mainLink').find('.sublinks a').live('click', function (e) { 
       var objChange = $('#mainLink').find('#change'); 
       if ($(this).attr('id') === 'other') { 
        objChange.parent().append($('<input />', { 'id': 'tbOthers', 'type': 'text' })); 
        objChange.remove();     
       } 
       else { 
        objChange.text($(this).text()); 
       } 
      }); 

     });