Cara Membatasi Klik Hanya Satu Kali menggunakan Jquery

Salah satu masalah dalam pemograman Javascript adalah bagaimana caranya bila kita ingin membatasi klik dari user hanya untuk Satu Kali saja ?, setelah melalui rangkaian percobaaan akhirnya saya mendapatkan satu function dasar untuk mengatasi masalah tersebut. Namun selanjutnya silahkan dikembangkan lagi dengan kreatifitas sobat blogger semua. Mari kita perhatikan contoh Function Pembatas Satu Klik ini :






<div id='input'>

<img src="http://cdn3-www.playstationlifestyle.net/assets/uploads/2014/07/mortalkombatxscreenshot4.jpg"/>
</div>

<div id='output'></div>

<script type='text/javascript'>
$( document ).ready(function() {
    SatuKlik('input','output','5000');
});

function SatuKlik(inDiv,outDiv,timEr)
{
$('#'+inDiv).one( "click", function (e){
    setTimeout(function(){$('#'+outDiv).append('<br>X: ' + e.pageX + ' ; Y: ' + e.pageY); }, timEr); 
});
return false;
}
</script>

Function berikut ini akan dapat di klik satu kali setelah jeda waktu 10 detik :

<div id='flash'>
<img src="http://cdn3-www.playstationlifestyle.net/assets/uploads/2014/07/mortalkombatxscreenshot4.jpg"/>
</div>

<div id='output'></div>

<script type='text/javascript'>
$( document ).ready(function() {
    setTimeout(function(){ toUrl('flash','http://www.trikalfanetcell.com'); }, 10000);
});

function toUrl(divOut,urlOut)
{
$('#'+divOut).one( "click",function() {
    window.open(urlOut,'_blank');
});
}
</script>

Function di atas hanya contoh dasar saja, mudah-mudahan menjadi inspirasi untuk sobat semua.....salam blogger
Previous
Next Post »