從文本框中獲取文本並將其放入javascript中

我正在執行自我打印功能，方法是收集用戶屏幕中的所有HTML並將其放入一個變量，然後顯示一個彈出屏幕，以便用戶可以打印該信息。從文本框中獲取文本並將其放入javascript中

 var disp_setting = "toolbar=no,location=no,directories=no,menubar=no,"; 
     disp_setting += "scrollbars=yes, height=500, left=100, top=25"; 
     var content_vlue = document.getElementById("print_content").innerHTML; 
     var docprint = window.open("", "", disp_setting); 
     docprint.document.open(); 
     docprint.document.write('<html><head>'); 
     docprint.document.write('</head><body text="#000000" onLoad="self.print()">'); 
     docprint.document.write('<table>'); 
     docprint.document.write(content_vlue); 
     docprint.document.write('</table>'); 
     docprint.document.write('</body></html>'); 
     docprint.document.close();

UPDATE： OK感謝很多的建議，到目前爲止，我已經開始取得一些進展...

我想什麼做的是不是操縱print_content，我會喜歡將print_content放入一個變量（即content_vlue），然後操作content_vlue。

var content_vlue = document.getElementById("print_content").innerHTML; 
$("content_vlue").find("INPUT[type='text']").each(function(i){ 
var input = $(this); 
input.replaceWith("<span class='textinput'>" + input.val() + "</span>"; 
});

有沒有辦法做到這一點？

來源

2011-01-06 webdad3

在您的更新，是'.print_content`選擇一個錯字？如果不是，它應該是`＃print_content`等同於`getElementById`。 – Chris 2011-01-06 23:27:01

@Rfvgyhn - 謝謝...這是我的錯字...我現在可以訪問該div的.html ...我仍然有問題，取代了文本框。 – webdad3 2011-01-07 17:01:31

你可以使用類似jQuery的庫嗎？這將是非常簡單的，以取代span標籤的投入，一旦你創建的頁面：

function cleaninputs(){ 
    $("body").find("input").each(function(i) { 
    var input = $(this); 
    input.replaceWith("<span class='textInput'>" + input.val() + "</span>"); 
    }); 
}

編輯：

這裏有一個稍微重構版本，它應該做你想要什麼：

function replaceInputs(_which){ 
    var cleanHTML = $("#"+_which).clone(); 
    cleanHTML.find("input").each(function() { 
    var input = $(this); 
    input.replaceWith("<span class='textInput'>"+ " " + input.val() + "</span>"); 
    }); 
    return cleanHTML.html(); 
}

然後替換此行：

var content_vlue = document.getElementById("print_content").innerHTML;

用：

var content_vlue = replaceInputs("print_content");

而且你應該全部設置。好措施我做了一個的jsfiddle：http://jsfiddle.net/pcsF3/1/

來源

2011-01-06 19:28:49 RSG

@RSG - 請參閱我更新的問題。 – webdad3 2011-01-06 23:24:45

只使用CSS，你可以簡單地隱藏的文本框邊框使它看起來像普通的文本：

docprint.document.write('<style type="text/css"> input { border: 0; }</style>');

來源

2011-01-06 20:07:06

從文本框中獲取文本並將其放入javascript中

回答

相關問題