ReadEasy

28 2月, 2011

QRcode Instant @ Refresh code

簡單來說就是QRcode Instant

用Google提供的Library快速產生QR code

code部分自己看source吧XD

可以作為jQuery基本的DOM操作練習

真是短到不能在短....


<title>QRcode Instant</title>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.2.6/jquery.min.js"></script>

<!-- <script type="text/javascript" src="http://lazy-load.googlecode.com/files/qrcode.js"></script> -->

<style type="text/css">

#right{
text-align:center;
background-color:#000000;
margin:0px;
padding:0px;
color:#FFFFFF;
}

#right p{
margin:0px;padding:3px;
}
</style>

<script>
function Qrcode()
{
/* $('#QR').empty().qrcode($('#Qcode').val()) */

$('#QR').empty().append('<img src=http://chart.apis.google.com/chart?cht=qr&chl=' + encodeURIComponent($('#Qcode').val()) + '&chs=300x300 />');

}
</script>
</head>

<textarea name="QCode" id="Qcode" rows="15" cols="56" class="text" onkeyup="Qrcode();"></textarea>

<div id="QR"></div>
<br>

<div id="right">
<p>code by Len - 2011/5/22 . *Refresh on 2011/6/4</p>
</div>






以下為效果





沒有留言:

張貼留言