Tạo trang test code ver1

2024-01-19 09:36

1. CODE:

<style scoped="" type="text/css">
#sidebar-wrapper {display:none;}
#header-wrapper {display:none;}
#nav {display:none;}
.breadcrumbs {display:none;}
.viennatop-wrapper {display:none;}
#viennalite-wrapper {margin: 0px auto;}
.post-inner {padding: 0px}
#post-wrapper {width: 98%;}
.post {padding: 0px 20px;}
.viennalite-info {margin-top: 0px; margin-bottom: 0px;}
form {margin: 0.3em 0;}
</style>
 
<div class="post-body entry-content">
<form method="post" name="form1"><div class="separator" style="clear: both; text-align: center;">Vùng nhập code</div>
<textarea name="code" onclick="focus(this.code)" style="background-image: url(https://1.bp.blogspot.com/-GKQNKxe0gX0/YLNBd6o8VRI/AAAAAAAAD-0/wJ7etGLgfmE8cVuPvphu_Kpom15U36i-ACPcBGAsYHg/s0/picnentap.png); background-repeat: repeat; border: 1px solid blue; height: 400px; padding: 5px; scroll: auto; width: 100%;"></textarea></form>
<button onclick="preview.document.write (document.getElementsByTagName ('TEXTAREA')[0].value); preview.document.close(); preview.focus()">Xem kết quả</button>
<button onclick="window.document.form1.code.value='';preview.document.write (document.getElementsByTagName ('TEXTAREA')[0].value); preview.document.close(); preview.focus()">Xoá code</button>
 
<!--Script gõ và xem code trong cùng trang có hai khung (Script 2)-->
<br /><div style="text-align: center;">Vùng xem kết quả</div></div><div class="post-body entry-content" style="text-align: center;"><iframe frameborder="0" name="preview" src="about:blank" style="background: #eeffff; border: solid 1px #b9b8b6; height: 400px; padding: 5px; width: 100%;"></iframe></div>
<br /><div style="text-align: center;">Chuyển đổi code từ HTML sang HTMLX</div>
<head>
<script type="text/javascript">
//<![CDATA[
function html2entities(){
var re=/[<>"'&]/g
for (i=0; i<arguments.length; i++)
arguments[i].value=arguments[i].value.replace(re, function(m){return replacechar(m)})
}
function replacechar(match){
if (match=="<")
return "&lt;"
else if (match==">")
return "&gt;"
else if (match=="\"")
return "&quot;"
else if (match=="'")
return "&#039;"
else if (match=="&")
return "&amp;"
}
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
//Character count script
function countit(what){
formcontent=what.form.charcount.value
what.form.displaycount.value=formcontent.length
}
//]]>
</script>
</head>
<body>
<form>
  <span style="color: #6b828e; font-family: Arial, Helvetica, sans-serif; font-size: small;"><textarea name="data1" style="background-image: url(https://1.bp.blogspot.com/-8cShfxHZvDk/YLM_UJQL85I/AAAAAAAAD-Q/CazenxWHLQoGhG1NqqYkYRn-8qd8dHlrgCPcBGAsYHg/s0/bgrepeat.png); background-repeat: repeat; height: 400px; overflow: hidden; padding: 10px; width: 98%;"></textarea>
  </span>
  <div align="">
  <span style="color: #6b828e; font-family: Arial, Helvetica, sans-serif; font-size: small;"></span>
      <input class="abt2" name="button" onclick="html2entities(this.form.data1)" onmouseout="this.className='abt2'" onmouseover="this.className='abt2 abt2hov'" type="button" value="Convert" /> 
      <input class="abt3" name="Clear" onmouseout="this.className='abt3'" onmouseover="this.className='abt3 abt3hov'" type="reset" value="  Clear  " />
</div>
</form>
</body>
<style scoped="" type="text/css">
#sidebar-wrapper {display:none;}
#header-wrapper {display:none;}
#nav {display:none;}
.breadcrumbs {display:none;}
.viennatop-wrapper {display:none;}
#viennalite-wrapper {margin: 0px auto;}
.post-inner {padding: 0px}
#post-wrapper {width: 98%;}
.post {padding: 0px 20px;}
.viennalite-info {margin-top: 0px; margin-bottom: 0px;}
form {margin: 0.3em 0;}
</style>
 
<div class="post-body entry-content">
<form method="post" name="form1"><div class="separator" style="clear: both; text-align: center;">Vùng nhập code</div>
<textarea name="code" onclick="focus(this.code)" style="background-image: url(https://1.bp.blogspot.com/-GKQNKxe0gX0/YLNBd6o8VRI/AAAAAAAAD-0/wJ7etGLgfmE8cVuPvphu_Kpom15U36i-ACPcBGAsYHg/s0/picnentap.png); background-repeat: repeat; border: 1px solid blue; height: 400px; padding: 5px; scroll: auto; width: 100%;"></textarea></form>
<button onclick="preview.document.write (document.getElementsByTagName ('TEXTAREA')[0].value); preview.document.close(); preview.focus()">Xem kết quả</button>
<button onclick="window.document.form1.code.value='';preview.document.write (document.getElementsByTagName ('TEXTAREA')[0].value); preview.document.close(); preview.focus()">Xoá code</button>
 
<!--Script gõ và xem code trong cùng trang có hai khung (Script 2)-->
<br /><div style="text-align: center;">Vùng xem kết quả</div></div><div class="post-body entry-content" style="text-align: center;"><iframe frameborder="0" name="preview" src="about:blank" style="background: #eeffff; border: solid 1px #b9b8b6; height: 400px; padding: 5px; width: 100%;"></iframe></div>
<br /><div style="text-align: center;">Chuyển đổi code từ HTML sang HTMLX</div>
<head>
<script type="text/javascript">
//<![CDATA[
function html2entities(){
var re=/[<>"'&]/g
for (i=0; i<arguments.length; i++)
arguments[i].value=arguments[i].value.replace(re, function(m){return replacechar(m)})
}
function replacechar(match){
if (match=="<")
return "&lt;"
else if (match==">")
return "&gt;"
else if (match=="\"")
return "&quot;"
else if (match=="'")
return "&#039;"
else if (match=="&")
return "&amp;"
}
//]]>
</script>
<script type="text/javascript">
//<![CDATA[
//Character count script
function countit(what){
formcontent=what.form.charcount.value
what.form.displaycount.value=formcontent.length
}
//]]>
</script>
</head>
<body>
<form>
  <span style="color: #6b828e; font-family: Arial, Helvetica, sans-serif; font-size: small;"><textarea name="data1" style="background-image: url(https://1.bp.blogspot.com/-8cShfxHZvDk/YLM_UJQL85I/AAAAAAAAD-Q/CazenxWHLQoGhG1NqqYkYRn-8qd8dHlrgCPcBGAsYHg/s0/bgrepeat.png); background-repeat: repeat; height: 400px; overflow: hidden; padding: 10px; width: 98%;"></textarea>
  </span>
  <div align="">
  <span style="color: #6b828e; font-family: Arial, Helvetica, sans-serif; font-size: small;"></span>
      <input class="abt2" name="button" onclick="html2entities(this.form.data1)" onmouseout="this.className='abt2'" onmouseover="this.className='abt2 abt2hov'" type="button" value="Convert" /> 
      <input class="abt3" name="Clear" onmouseout="this.className='abt3'" onmouseover="this.className='abt3 abt3hov'" type="reset" value="  Clear  " />
</div>
</form>
</body>
 
2.  DEMO:
 
Vùng nhập code

Vùng xem kết quả

Chuyển đổi code từ HTML sang HTMLX