Convert Character Unik Code jQuery Plugin

Hadir kembali bersama Beben si bloglang anu ganteng kalem tea. Selalu nemplok pada web/blog gaya punya guna diacak-acak ada apa saja didalamnya (sukur² kalo ada tutorial blog) :D Masih ingat dengan artikel mengenai convert. Itu yang setiap kali kita mau memasukan tulisan berupa kode-kode/script pada postingan! Harus diconvert dulu kan, biar bisa muncul. Silahkan sobat membaca postingan berikut guna mendapatkan kode untuk mengconvert script for convert.
Bisa dijadikan inspirasi jika sobat memang berniat baca-baca dari web ini Superdit. Keren oke punya artikelnya sob :-bd

Trik jQuery plugin kali ini datang dari sana, yaitu bagaimana membuat deteksi kode karakter (Detect Character Code) Sobat mungkin sudah pada tau bahwa blogger blogspot ini berbasis XHTML. Dimana penulisannya sedikit berbeda dengan HTML pada umumnya! Introduction for XHTML XHTML Introduction dan perbedaan antara HTML 4.01 ama XHTML XHTML vs HTML.
Trik dan tips kali ini maka hadir guna memphrase tulisan (kode) unik agar bisa valid terhadap format XHTML :) Contoh deh:

Unique Code	Write in XHTML
@	@
►	►
←	←

Yang sebelah kanan itu kode yang valid XHTML jika sobat mau menulis pada edit² daleman template contohnya. Memang kadang ada yang langsung secara otomatis terphrase, namun tidak sedikit yang tidak dapat terphrase oleh editor blog. Mari kita lanjutin gimana cara bikin toolsnya ah ;))

demo

Masukin semua bumbu ini dengan teknik Add a Gadget ► HTML/Javascript :D

<script type="text/javascript">
   $(document).ready(function() {
       $("#field").keypress(function(event) {
           $(this).val(String.fromCharCode(event.charCode));
           $("#codespan").html(event.charCode);
           $("#charspan").html(String.fromCharCode(event.charCode));
       });
   });
</script>

<style type="text/css">
.cont_inside {
   padding: 5px;
}
.lbl {
   font-size: 20px;
   padding: 2px 7px;
   background: #5566FF;
   color: #ffffff;
}
#field, .span {
   font-family: "Times New Roman";
   width: 20px;
   font-size: 20px;
   padding: 2px 7px;
   background: #000000;
   color: #ffffff;
   border: 1px solid #000000;
}
.span {
margin-left: 5px;
}
</style>

<div class="cont_inside">
<label for="field" class="lbl">Press a key &rarr;</label>
<input type="text" id="field" maxlength="1"/>
</div>
<div class="cont_inside">
<span class="lbl">Character Code: </span>
<span class="span" id="codespan"></span>
</div>
<div class="cont_inside">
<span class="lbl">String.fromCharCode</span>
<span class="span" id="charspan"></span>
</div>

Beres :P
Keterangan:

1. Kotak pertama.
Ketikan kode unik pada kotak pertama. Misalkan sobat mengetik pada keyboard Ctrl + (NumLock) 16
2. Kotak kedua.
Hasil generated dari kotak pertama. Sobat hanya tinggal menambahkan kode ini didepan &# pada belakang tambahkan ;
Jika hasil generated 15 maka menjadi 
3. Kotak ketiga.
Hasil akhir proses.

Happy blogging \m/