變換輸入回按鈕一個div單擊

Question

我使用下面的代碼

$(document).on('click', '#editDetailBtn', function() { 

    var input = $('<input id="#detailprimaryDescription" type="text" />'); 
    input.val($('#detailprimaryDescription').text()); 
    $('#detailprimaryDescription').replaceWith(input); 


    $('#editDetailBtn').hide(); 
    $('#detailPrimaryCancel').show(); 
    $('#detailPrimarySave').show(); 

}); 


$(document).on('click', '#detailPrimaryCancel', function() { 


    var input = $('<div id="#detailprimaryDescription" ></div>'); 
    //input.val($('#detailprimaryDescription').text()); 
    $('#detailprimaryDescription').replaceWith(input); 


     $('#editDetailBtn').show(); 
     $('#detailPrimaryCancel').hide(); 
     $('#detailPrimarySave').hide(); 

}); 

什麼，我想實現的是，一旦取消點擊那麼它將turne輸入字段回一個div

http://jsfiddle.net/7XWAu/

Answer 1

我想這就是你要拍的。

JS FIDDLE

你不需要把「＃」在DOM的ID的開始，它只是用來參考元素。

所以基本上，每一個地方，你有這樣的事情：

var input = $('<input id="#detailprimaryDescription_input" type="text" />'); 

你shouuld做類似：

var input = $('<input id="detailprimaryDescription_input" type="text" />'); 

一次我清理，最多它的工作，因爲它在小提琴。

我想說的是，更好的做法是隻顯示和隱藏包含所有這些輸入的div，而不是操縱DOM來不斷創建/銷燬它們。