Javascript 如何在文本区域中放置隐藏的输入字段
我想制作一个弹出文本框，将弹出窗口中文本区域的源代码显示为网页，同时它将不显示文本区域中的打印按钮代码，因为该文本仅作为弹出窗口的功能。正如您所看到的，我的textarea内容包含javascript和html，它们需要隐藏在textarea之外，但同时需要位于文本区域内，弹出窗口才能工作 这意味着我不能将它们放在textarea之外，因为该函数将不会显示在弹出窗口中，该窗口将显示web编辑器textarea中的所有内容，除非弹出窗口的目标是包含textarea而不是直接包含textarea的div。即使如此，这也会带来一个问题，因为当获取弹出窗口时，textarea将不再转换为网页 我将此文本区域用于弹出窗口：Javascript 如何在文本区域中放置隐藏的输入字段,javascript,html,view,popup,textarea,Javascript,Html,View,Popup,Textarea,我想制作一个弹出文本框，将弹出窗口中文本区域的源代码显示为网页，同时它将不显示文本区域中的打印按钮代码，因为该文本仅作为弹出窗口的功能。正如您所看到的，我的textarea内容包含javascript和html，它们需要隐藏在textarea之外，但同时需要位于文本区域内，弹出窗口才能工作 这意味着我不能将它们放在textarea之外，因为该函数将不会显示在弹出窗口中，该窗口将显示web编辑器textarea中的所有内容，除非弹出窗口的目标是包含textarea而不是直接包含textarea的d
<textarea name="textfield" cols="107" rows="31" id="CodeExample" wrap="soft" style="font-size:12px; font-family: Arial, Helvetica, sans-serif; color:#ffffff; background-color:rgba(0,0,0,0.8); resize: none;" placeholder="The is Source Codes here"><script language="Javascript">
function printit(){
if (NS) {
window.print() ;
} else {
var WebBrowser = '<OBJECT id="WebBrowser1" width=0 height=0 CLASSid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';
document.body.insertAdjacentHTML('beforeEnd', WebBrowser);
WebBrowser1.ExecWB(6, 2);//Use a 1 vs. a 2 for a prompting dialog box WebBrowser1.outerHTML = "";
}
}
</script>
<script language="Javascript">
var NS = (navigator.appName == "Netscape");
var VERSION = parseInt(navigator.appVersion);
if (VERSION > 3) {
document.write('<form><input type=button value="Print this Page" name="Print" onClick="printit()" style="margin-bottom: 0px; font: bold 11px Arial, Sans-Serif;"></form>');
}
</script></textarea>
<br>
<!-- Run Textarea field in popup BEGIN -->
<script type="text/javascript">
var win = null;
function NewWindow(mypage,myname,w,h,scroll) {
LeftPosition = (screen.width) ? (screen.width-w)/2 : 0;
TopPosition = (screen.height) ? (screen.height-h)/2 : 0;
settings =
'height='+h+',width='+w+',top='+TopPosition+',left='+LeftPosition+',scrollbars='+scroll+',resizable'
win = window.open(mypage,myname,settings);
if (window.focus) {win.focus()}
var t = document.form1.textfield.value;
win.document.write(t);
}
</script>
<input type = "button" value = "Preview" name = "preview" onclick = "NewWindow('','myPop','500','400','yes')">
<!-- Run Textarea field in popup END -->
函数printit（）{
如果（NS）{
window.print（）；
}否则{
var WebBrowser=''；
document.body.insertAdjacentHTML（'beforeEnd'，WebBrowser）；
WebBrowser1.ExecWB（6，2）；//使用1和2作为提示对话框WebBrowser1.outerHTML=“”；
}
}
var NS=（navigator.appName=“Netscape”）；
var VERSION=parseInt（navigator.appVersion）；
如果（版本>3）{
文件。写（“”）；
}
var-win=null；
函数新建窗口（mypage、myname、w、h、滚动）{
LeftPosition=（屏幕宽度）？（屏幕宽度-w）/2:0；
顶部位置=（屏幕高度）？（屏幕高度-h）/2:0；
背景=
'高度='+h+'，宽度='+w+'，顶部='+TopPosition+'，左侧='+LeftPosition+'，滚动条='+scroll+'，可调整大小'
win=窗口。打开（mypage、myname、设置）；
if（window.focus）{win.focus（）}
var t=document.form1.textfield.value；
win.document.write（t）；
}
所以现在我想要的是打印按钮代码在文本区域中不可见，但是当弹出按钮运行时，它们作为打印按钮可见。这样，打印按钮将添加到网页设计师添加到框中的可见源代码中。更新 当我发布这个问题时，我发现整个互联网上都没有答案。 经过长时间的摆弄，我把这个问题贴在这里。幸运的是，在贴出问题几分钟后，我找到了如何做的答案。我不会删除这个问题，因为我是第一个在互联网上找到并回答这个问题的人 解决方案： 我解决了这个问题，只需创建一个链接到输入弹出javascript的隐藏文本区域，该javascript也链接到可见的textera。这样一来，可视文本区域中的内容将出现在弹出窗口中，当单击“预览”按钮时，隐藏文本区域中隐藏的功能也将出现在同一弹出窗口中 您可以将任何HTML、CSS或JavaScript代码放入可见文本区域和隐藏文本区域，使所有输入代码从可见文本区域隐藏，但在打开弹出窗口时处于活动状态
<form name = "form1">
<textarea name="textfield" cols="107" rows="31" id="CodeExample" wrap="soft" style="font-size:12px; font-family: Arial, Helvetica, sans-serif; color:#ffffff; background-color:rgba(0,0,0,0.8); resize: none;" placeholder="Put your Source Codes here">
</textarea>
<textarea hidden="on" name="textfield2" cols="1" rows="1" id="CodeExample2">
<script language="Javascript">
function printit(){
if (NS) {
window.print() ;
} else {
var WebBrowser = '<OBJECT id="WebBrowser1" width=0 height=0 CLASSid="CLSID:8856F961-340A-11D0-A96B-00C04FD705A2"></OBJECT>';
document.body.insertAdjacentHTML('beforeEnd', WebBrowser);
WebBrowser1.ExecWB(6, 2);//Use a 1 vs. a 2 for a prompting dialog box WebBrowser1.outerHTML = "";
}
}
</script>
<script language="Javascript">
var NS = (navigator.appName == "Netscape");
var VERSION = parseInt(navigator.appVersion);
if (VERSION > 3) {
document.write('<form><input type=button value="Print this Page" name="Print" onClick="printit()" style="margin-bottom: 0px; font: bold 11px Arial, Sans-Serif;"></form>');
}
</script>
</textarea>
<br>
<!-- Run Textarea field in popup BEGIN -->
<script type="text/javascript">
var win = null;
function NewWindow(mypage,myname,w,h,scroll) {
LeftPosition = (screen.width) ? (screen.width-w)/2 : 0;
TopPosition = (screen.height) ? (screen.height-h)/2 : 0;
settings =
'height='+h+',width='+w+',top='+TopPosition+',left='+LeftPosition+',scrollbars='+scroll+',resizable'
win = window.open(mypage,myname,settings);
if (window.focus) {win.focus()}
var t1 = document.form1.textfield.value;
var t2 = document.form1.textfield2.value;
win.document.write(t1);
win.document.write(t2);
}
</script>
<input type = "button" value = "Preview" name = "preview" onclick = "NewWindow('','myPop','500','400','yes')">
<!-- Run Textarea field in popup END -->
</form>
函数printit（）{
如果（NS）{
window.print（）；
}否则{
var WebBrowser=''；
document.body.insertAdjacentHTML（'beforeEnd'，WebBrowser）；
WebBrowser1.ExecWB（6，2）；//使用1和2作为提示对话框WebBrowser1.outerHTML=“”；
}
}
var NS=（navigator.appName=“Netscape”）；
var VERSION=parseInt（navigator.appVersion）；
如果（版本>3）{
文件。写（“”）；
}
var-win=null；
函数新建窗口（mypage、myname、w、h、滚动）{
LeftPosition=（屏幕宽度）？（屏幕宽度-w）/2:0；
顶部位置=（屏幕高度）？（屏幕高度-h）/2:0；
背景=
'高度='+h+'，宽度='+w+'，顶部='+TopPosition+'，左侧='+LeftPosition+'，滚动条='+scroll+'，可调整大小'
win=窗口。打开（mypage、myname、设置）；
if（window.focus）{win.focus（）}
var t1=document.form1.textfield.value；
var t2=document.form1.textfield2.value；
win.document.write（t1）；
win.document.write（t2）；
}
如果你像我一样使用预览功能在线制作网页编辑器，那么它突然变得有意义了。因为您希望预览您在textarea框中输入的代码，并且在预览时还希望textarea框显示一些额外的按钮，例如打印您所做的预览。非常适合测试设计或页面等，然后通过单击文本区域框生成的弹出窗口上的一个按钮将其打印出来。看看我找到的解决方案，自己测试一下，看看我的意思和原因。它将与任何HTML、CSS和JS源代码一起工作
如果您不理解为什么需要它以及它是如何工作的，请自己测试它。将其他