2013-04-10 24 views
2

請幫助我在此代碼或其他工作代碼上使用jquery在輸入類型=「text」和textarea之間切換。如何使用jquery在輸入類型=「文本」和textarea之間切換

$(function(){ 
$("a#change").toggle(function(){ 
    var input = document.getElementById('text'), 
    textarea = document.createElement('textarea'); 
    textarea.id = input.id; 
    textarea.cols = 40; 
    textarea.rows = 5; 
    textarea.value = input.value; 
    input.parentNode.replaceChild(textarea,input); 
    return false; 
},function(){ 
    textarea.parentNode.replaceChild(input,textarea); 
    return false; 
}); 

});

<input type="text" name="text" id="text" /><a href="#" id="change">change</a> 
+1

你能告訴我們HTML嗎?您可能需要檢測'textarea'是哪個節點號,然後用'input'字段替換該節點索引。它們是不同類型的元素,因此您需要捕獲要傳輸的數據,然後使用新元素重寫元素位置。 – 2013-04-10 19:41:24

+1

你的第二個函數試圖訪問一個未定義的'textarea'變量。 – 2013-04-10 19:41:37

+0

可能的副本http://stackoverflow.com/questions/2382289/changing-input-text-to-textarea-just-like-in-facebook – inputError 2013-04-10 19:42:42

回答

4

以下應爲你工作。

var textbox = $("#textbox"); 
var textarea = $("<textarea id='textarea'></textarea>"); 
$("#change").click(function() { 
    //Check for textbox or textarea 
    if ($("#textbox").length === 1) { 
     //Copy value to textarea 
     textarea.val(textbox.val()); 
     //Replace textbox with textarea 
     textbox = textbox.replaceWith(textarea); 
    } else { 
     //Copy value to textbox 
     textbox.val(textarea.val()); 
     //Replace textarea with textbox 
     textarea = textarea.replaceWith(textbox); 
    } 
}); 

你可以在第二行設置你需要的列和行。

jsFiddle

相關問題