Események tiltása.

Figyelem:
Az oldalon több esemény letiltás témakör tesztelhető.
Némelyik az egész oldalra érvényes.
Biztonsággal tesztelhessünk, minden témakör tesztelése előtt, üssük le az F5 billentyűt.


Témakörök. Tiltás figyelmeztetés, néhány böngészőben. Néhány esemény tiltása. Egér bal és jobb billenytűjének tiltása. Billentyűzet, azaz, klaviatúra tiltás. Fotók másolásának megnehezítése, tiltása. Képernyőmásolat megnehezítése, másolás korlátozása. Leütött billentyű kódszáma. Tiltás helyett, kiléptetés a megadott címre. Tiltás tesztelése, oncopy="return false" meghatározással.

Némelyik böngészőben, belépéskor megjelenik letiltás figyelmeztetés.

Következő részben láthatjuk, milyen figyelmeztetések lehetnek.

Böngésző figyelmeztetése.

Megjegyzések:

window.addEventListener("afterprint", myFunction);
- A billentyűparancsoknál, például a Ctrl+P beállítja az oldal nyomtatását.
- A PrintScreen leütése, képernyőmásolatot készít.

Az afterprint eseményt, Safari és Opera nem támogatja.
- Az IE-ben az utónyomtatási esemény a nyomtatási párbeszédpanel előtt történik, nem utána.

Az onafterprint eseményt, Safari és Opera nem támogatja.
- Az IE-ben az onafterprint esemény a nyomtatási párbeszédpanel előtt történik, nem utána.

Az onbeforeprint eseményt, Safari és Opera nem támogatja.

Az oncontextmenu eseményt minden böngésző támogatja, a contextmenu attribútuma jelenleg csak a Firefoxban támogatott.

Az addEventListener() metódus nem támogatott, Internet Explorer 8 és korábbi verzióiban.

<img src="kep.gif" oncopy="myFunction()" width="yyy" height="xxx">
- Előfordulhat, hogy ez a példa egyes böngészőkben, nem az elvárásoknak megfelelően működik.

Amikor a weboldalunk vagy annak egy meghatározott tartalmának, fotójának, stb. kijelölését másolását korlátozni akarjuk, a következőket tehetjük.

Nincs engedélyezve JavaScript futtatása, akkor jelenjen meg egy figyelmeztető ablak addig, még felhasználó nem engedélyezi.
Oldalra belépéskor egy figyelmeztető ablakot kell megjeleníteni, mely figyelmezteti felhasználót, tartamirész megtekintéséhez engedélyezni kell parancsprogramok, ActiveX-vezérlők, JavaScript futtatását.
Nem fontos a teljes oldal tartamára, JavaScript futtatást engedélyeztetni. Ekkor a védett tartalmirész, fotó, stb. csak akkor jelenik meg, ha JavaSript futtatása engedélyezve van.
A védett tartalmirészt, JavaScript vagy PHP fájlban helyezzük el, és innen íratjuk ki. Ezzel azt is megnehezítjük, hogy oldal forrása megtekintésekor sem látható, a tiltott tartalmirész.
Tovább nehezíthetjük kijelölésre, másolásra letiltott tartalom megnehezítését azzal, hogy JavaScript vagy PHP fájlban, tartalmirészt kódolt formátumban írjuk meg.
Még egy tipp:
- Tiltott tartalmirészhez, helyezzünk el "vízjelet", mely egy olyan háttérkép ami a tartalmirész olvashatóságát, megtekintését nem akadályozza, de másolatkor ez is a másolaton lesz.
- Tartalmi rész vagy fotó csak addig látható, még az egérkurzor adott terület felett van.
- Fotókon helyezzünk el egyedi lenyomatot, mely másolatkor is látható lesz.

Számitástechnikában, programozásban jártas felhasználóknál, csak megnehezíthető tökéletes másolat készítése, mellyel kedvüket vesszük a másolgatástól.
Képernyőmásolatot letiltani jelenlegi meghatározásokkal nem tudjuk, de ekkor fotómásolat készül.
Ha elhelyezünk "vízjelet" lenyomatot tiltandó területen, akkor ez is a másolaton lesz, melynek eltüntetése időigényes, komoly szaktudás és fotószerkesztő program is kell.

Letiltás mire jó:
Olyan oldalt készítünk, melynek adott területén végzendő műveleteknél, fontos a billentyűzet, egéresemény, vagy más esemény letiltása.
Vagy, átlag felhasználóknál, másolás akadályozására letiltására alkalmazhatjuk.

Néhány esemény letíltása.
Teljes weboldalon, vagy kiválasztott területen.

Nincs letiltva:
- Balos egérbillentyűvel kattintás.
- Oldal görgetése.
- Billentyűzet.

<body onselect="return false" oncontextmenu="return false" ondragstart="return false" onselectstart="return false" oncopy="return false" onbeforecopy="return false">

		<h2>A body elemben meghatározott letiltások, a teljes weboldalra vonatkoznak.</h2>
		
A kezdő <body"> elemben, meghatározható letíltások.
onselect="return false"                // Kiválasztás.
oncontextmenu="return false"      // Helyi menü.
ondragstart="return false"            // Húzás indítás.
onselectstart="return false"         // Kiválasztás.
oncopy="return false"                  // Másolat.
onbeforecopy="return false"         // Másolás előtt.

Példában, a body elemben vannak a meghatározások, ezért a teljes weboldalra érvényesek.
Ha kiválasztott div elemben helyezzük el a meghatározásokat, akkor az adott div elem területére érvényesek.
A fenti meghatározásokat JavaScript is vezérelheti. Ekkor nem kell a body elemben meghatározni.

Teszteljük le. Kattintsunk a letiltás gombra, majd teszteljük az egeret.

Kattintás és billentyűzet tesztelése. ( Ne feledjük: kattintás és billentyűzet nincs letiltva.)

Teszteléshez, input ablak:

Teszteléshez, textarea ablak:

Vissza oldal elejére!

Egér bal és jobb billenytűjének letiltása.

A letiltás nem érvényes, a button gombra történő kattintásra.

Teszteljük le. Kattintsunk a letiltás gombra, majd teszteljük az egeret.

Teljes weboldalra érvényes.

<head>

<script>
function egeresemeny (e) {  if (!e) e = window.event;
        return false;               // Feloldáshoz, false meghatározás helyett, true meghatározás kell.
}

document.onmousedown  = egeresemeny;       // Billentyűt lenyomták.   Kijelölt területen, 
document.onmouseup = egeresemeny;           // Billentyűt felengedték. Kijelölt területen, 
document.onclick =  egeresemeny;                // Kattintottak. Kijelölt területen, 
document.ondblclick =  egeresemeny;            // Duplán kattintottak. Kijelölt területen.
document.oncontextmenu =  egeresemeny;     // Menü, jobbos kattintáskor. Kijelölt területen.
</script>

</head>

Vissza oldal elejére!

Billentyűzet, azaz, klaviatúra kikapcsolása.

A string billentyűk, és néhány müveleti billentyű kikapcsolása:

String billentyűk:     0-tól 9-ig számok, és  A-tól Z-ig karakterek. 
Müveleti billentyűk:  'enter',   'up',   'down',   'left',    'right',      'space',   'backspace',     'delete',   és az    'esc'.

String billentyűk letiltásával, Ctrl+string billentyű kombinációs műveletek is, le vannak tiltva.

<head>
	<script>
		document.onkeydown = function (e) { return false; }		
	</script>
</head>

1. Kattintsunk az input vagy textarea ablakba, és írjunk be valamit, majd töröljük ki.

Input ablak:

Textarea ablak:

Teszteljük le. Kattintsunk a letiltás gombra.

2. Letiltás után, kattintsunk az input vagy textarea ablakba, és próbáljunk beírni valamit.

Vissza oldal elejére!

Fotók másolásának megnehezítése, tiltása.

Megjegyzés:
A Ctrl+P, beállítja az oldal nyomtatását akkor, ha billentyűzet nincs letíltva.
A PrintScreen leütése, képernyőmásolatot készít.

Eredeti fotón mindig helyezzünk el aláírást, autógrammot, vagy egyedi jelet, mely másolásnál is látható lesz.
Egyedi jeleinket fotóról nyom nélkül eltüntetni, komoly szaktudásra és programra van szüksége annak, aki másolja.

Ezek a fotó és lenyomatminták.
Nem eredeti fotó és eredeti lenyomattal.		Eredeti fotó és lenyomat.
1. Mindig látszik, nem az eredeti fotó, másolható nyom nélkül. 2. Eredeti lenyomattal, akkor jelenik meg, ha JavaScript engedélyezve, és az 1. fotóra mozgatják az egérkurzort.		3. Eredeti fotó, mindig látszik. 4. Általunk elhelyezendő lenyomat. Eredeti fotón vagy fotókon, mindig látszik.
1. Fotó	2. Fotó	3. Fotó	4. Lenyomat. A L A P W E B L A P

Következő területen tesztelhetjük, megjelenítendő fotókat.
Eredeti fotó megtekintéséhez, mozgasd egeret a fotóra.	Eredeti fotó lenyomattal. Mozgasd egeret a fotóra. A L A P W E B L A P

<head> 
<title>Esemény letiltása.</title>
<script src=https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js></script>
<script language="JavaScript" type="text/javascript" src="esemenykezelo.js"> </script>
<link href="stilus.css" rel="stylesheet" type="text/css" />
</head>

<body>
<p>Eredeti fotó megtekintéséhez,<br> mozgasd egeret a fotóra.</p>
<div id="fotoletilt">
<img id="hamisf" src="hamis.jpg" alt="Hamis fotó" width="150" height="150" border="0" /> 
<img id="valosf" src="valos.jpg" alt="Eredeti fotó" width="150" height="150" border="0" />
</div>

<p>Eredeti fotó lenyomattal.<br> Mozgasd egeret a fotóra.</p>
<div id="fotolenyomat">

  <div id="lenyomat">
<pre>
 A
    L
       A
          P
 W  E  B  L  A  P
</pre>
  </div>
<img class="eredetikep" src="eredeti.jpg" alt="Eredeti fotó" width="150" height="150" border="0" />

</div>

</body>

/* CSS, azaz, stilus.css fájl tartalma. */

#fotoletilt{width:150px; border:none; padding:0.1px; background-color: white;}
#hamisf{display:block;}
#valosf{display:none;}

#fotolenyomat{ width: 150px; height: 150px; }
#lenyomat{ position: absolute; margin-top:85px; }                      /* Lenyomat pozíciója a képen. */
#lenyomat pre{ font-family: Arial; font-size: 10px; color: white; line-height:100%; }

.eredetikep{opacity:0.5; filter:alpha(opacity=10);}                     /*  Eredeti kép élessége, halvány. */

// esemenykezelo.js fájl tartalma. ---------------------------

$(document).ready(function(){

// Kijelölt fotó területén van az egérkurzor. ----------
$('#hamisf').mouseover(function() {
        $('#hamisf').css("display","none");                        //  Másolható kép elrejtése.
        $('#valosf').css("display","block");                         //  Eredeti kép megjelenítése.
		
document.onkeydown = function (e) { return false; }                  // Billentyűzet letiltása.

window.addEventListener("keyup",kPress,false);

    function kPress(e) {	 
        var cp=e.keyCode||e.charCode;
            if(cp==17 || cp==44){                                    // Másolat készítésnél kiléptetés.
                URL_cim="../javascriptek.html";
                window.location.replace(URL_cim);
            }
    }
});
// Ha elhagyják a kijelölt fotó területet. -----------
$('#valosf').mouseout(function() {
        $('#hamisf').css("display","block");                        //  Másolható kép megjelenítése.
        $('#valosf').css("display","none");                          //  Eredeti kép elrejtése.
});
// -----------------------------------------------------------------------------------------------------------


// Második, eredeti képhez. --------------------------------------------------------------------
 $('.eredetikep,#lenyomat').mouseover(function() {
	 $('.eredetikep').css("opacity","1").css("filters.alpha.opacity","100");      //  Eredeti kép élessége, jó. 
		
document.onkeydown = function (e) { return false; }                   // Billentyűzet letiltása.

window.addEventListener("keyup",kPress,false);

    function kPress(e) {	 
        var cp=e.keyCode||e.charCode;
            if(cp==17 || cp==44){                                      // Másolat készítésnél kiléptetés.
                URL_cim="../javascriptek.html";
                window.location.replace(URL_cim);
            }
    }
 });
 
 $('.eredetikep,#lenyomat').mouseout(function() {
	 $('.eredetikep').css("opacity","0.4").css("filters.alpha.opacity","40");     // Eredeti kép élessége, halvány.
 });
// --------------------------------------------------------------------------------------------------

});

Vissza oldal elejére!

Képernyőmásolat megnehezítése.
Egy kiválasztott területen, másolás korlátozása.

Teszteljük le.
Piros kerettel kijelölt teszt területen, akkor jelenik meg tiltott tartalom, még az egérkurzor a terület felett van.

Mi történik ha:
- Egérbillentyűtt lenyomjuk, például kijelölés céljából.
- Egérbillentyűt másodszor is lenyomjuk.
Egérkurzor a terület felett:
- Nyomjuk le Ctrl+P billentyűt. Kiléptet az oldalról. Vagy, oldal nyomtatásra kész, de a rejtett tartalom nem.
- Nyomjuk le PrintScreen billentyűt. Képernyőmásolat kész, de tartalmazza a "vízjelet" is, és kiléptet az oldalról.

Figyeljünk!
Amikor bármelyik irányba elhagyjuk egérkurzorral a pirossal kijelölt területet, üssük le az F5 billentyűt,
mellyel feloldjuk a Ctrl és Print billentyűre vonatkozó meghatározásokat, hogy oldal további részeinek tesztelésekor, alkalmazhassuk ezeket a billentyűket is úgy, hogy ne léptessenek ki erről az oldalról.

Ez egy teszt terület.
Mozgassuk ide az egérkurzort.
Tartalmi rész addig olvasható,
még egérkurzor el nem hagyja,
kijelölt területet.

Az itt leírtak csak olvashatók, de nem másolatók, nyom nélkül.

Jelen esetben, csak az egérrel történő kijelölés másolásra van megakadályozva.

Képernyőmásolat nincs letiltva. De vízjel elhelyezésével, tökéletes másolat készítését megnehezíthetjük.

Ha mégis készítenek képernyőmásolatot, vízjel és egérkurzor, a másolaton is látható lesz.

Vízjel olyan háttérkép, mely az olvashatóságot nem akadályozza, de másolaton nyoma lesz.

Tartalmi rész megjelenéséhez, engedélyezni kell JavaScript futtatását.

<head> 
<title>Esemény letiltása.</title>
<script src=https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js></script>
<script language="JavaScript" type="text/javascript" src="esemenykezelo.js"> </script>
<link href="stilus.css" rel="stylesheet" type="text/css" />
</head>

<body>

<div id="kijelolt">     <!-- A tiltott div terület. -->
    <p>
        Ez egy teszt terület.<br>
        Mozgassuk ide az egérkurzort.<br>
        Tartalmi rész addig olvasható,<br>
        még egérkurzor el nem hagyja,  kijelölt területet.
    </p>
    <br><br>
	
    <span id="rejtheto"> <br><br> </span>  <!-- Rejtett dokumentum helye. -->
	
</div>             <!-- A tiltott div terület lezárása. -->

   <!-- A tiltott szöveget tartalmazó script meghívása. -->
<script language="JavaScript" type="text/javascript" src="letiltott.js"></script>

</body>

/*  CSS, azaz, stílus meghatározás.  */
#kijelolt{width:99.8%; padding: 5px; border:2px solid red; background-color: white;}
#rejtheto{visibility:hidden;}
#kijelolt,#kodok{ background-image:url('vizjel570x570.gif'); background-repeat:no-repeat; background-position:50%; background-attachment:fixed; }

// A letiltott.js fájl tartalma.
id = document.getElementById ("rejtheto");
var tartalom=('<p id="kodok"> Müveleti billentyűk kódszáma.<br> Back Space = 8<br> Ctrl = 17<br> Print Scren = 44 </p>'); 
id.innerHTML = tartalom;

// esemenykezelo.js fájl tartalma. -------------

$(document).ready(function(){

// Megnehezítése a kiválasztott terület másolásának. -------------
var kattint=0;
 $('#kijelolt').mousedown(function() {
	 kattint++;

// Kattintás kijelölt területen, akkor figyelmeztetés.
alert ('Az alert és confirm egyszer hatásos biztonsággal.\nMásodszori megjelenéskor mejelenít egy jelölőnégyzetet.\nFelhasználó rákattint a jelölőnégyzetre, figyelmeztetóablak továbbiakban nem jelenik meg.\n\n Ezért jó, ha figyelmeztetés mellett, biztonsági okból, elrejtjük a tartalmat is.');

	  
        if(kattint==2){ujOldal();}                     // Másodszori kattintákor, kiléptetés.
           function ujOldal(){
               URL_cim="../javascriptek.html";
               window.location.replace(URL_cim);
            }
 });


// Kijelölt területen van, az egérkurzor. -------------------------
 $('#kijelolt').mouseover(function() {
	   $('#rejtheto').css("visibility","visible");       // Rejtett tartalom, látható lesz.
	   $('#kodok').css("background-color","white");
	   $('#kijelolt').css("background-color","silver");

    document.onkeydown = function (e) { return false; }       // Billentyűzet letiltva.

    window.addEventListener("keyup",kPress,false);

        function kPress(e) {	 
            var cp=e.keyCode||e.charCode;
                if(cp==17 || cp==44){                         // Meghatározott billentyű kódnál, kiléptetés.
                      URL_cim="../javascriptek.html";
                      window.location.replace(URL_cim);
                }
        }	  
 });

// Ha elhagyják a kijelölt területet. -------------------------
        $('#kijelolt').mouseout(function() {
            $('#kijelolt').css("background-color","white");
            $('#rejtheto').css("visibility","hidden");       // Tartalom rejtve lesz.

        });

});

Vissza oldal elejére!

Leütött billentyű kódszámának lekérdezése.

Üssünk le, tetszőleges billentyűt.

Leütött billentyű kódszáma:

Billentyűk kódjának tesztelésével végeztünk, üssük le az F5 billentyűt!

Program leírása.

<button onClick="keyupletiltas()">Kódszám teszthez, katt ide!</button>
<h3>Leütött billentyű kódszáma: <span id="billentyuadat"></span></h3>

<script>
function keyupletiltas(){
window.addEventListener("keyup",kPress,false);
}
function kPress(e) {
var kc=e.keyCode||e.charCode;
 
  id = document.getElementById ("billentyuadat");
  id.innerHTML = kc;
}
</script>

Vissza oldal elejére!

Új oldalra, azaz, a megadott címre léptetés.

Megadhatunk teljes URL címet is.
Például így: URL_cim="https://wpaulina.hu/asztali/index.html";

<input type="button" value="Erre az URL-re! javascriptek.html." onClick="ujOldal()">

<script type="text/javascript">
   function ujOldal() {    URL_cim="javascriptek.html";     window.location.replace(URL_cim);   }
</script>

Tesztejük le. Kattints a button gombra.

Tíltás helyett, kiléptetés a megadott címre.

Ctrl és PrintSreen billetyűk lenyomásakor, kiléptetés az oldalról oda, ahonnan ide beléptek.

window.addEventListener("keyup",kPress,false);
 function kPress(e) {
        var c=e.keyCode||e.charCode;
        if(c==17 || c==44) {history.back();} 
 }

Vagy kiléptetés oda, amit meghatározunk.

window.addEventListener("keyup",kPress,false);
 function kPress(e) {
        var c=e.keyCode||e.charCode;
        if(c==17 || c==44) { URL_cim="https://wpaulina.hu/asztali/index.html";  window.location.replace(URL_cim); } 
 }

Vissza oldal elejére!

Az oncopy teszteléshez.

<body oncopy="return false">   <!-- Helyezzük el, közvetlen a kezdő body elemben.  -->

Tesztelés előtt, nyissunk meg egy szöveges fájlt. Például: txt fájlt vagy Word fájlt.
Másoljunk ki tetszőleges szöveget, és próbáljuk beilleszteni megnyitott szöveges fájlba.

Másolás letiltását, a következő területen tesztelhetjük.

<div oncopy="return false">
Tesztelve:
- Firefox jó.
- Chrome jó.
- Explorer és Microsoft Edge jó, ha engedélyezzük parancsprogramokat és ActiveX-vezérlőket futtatni.

<p> Ez egy másolási teszt területe, melyből tetszőleges részt kijelölhetünk és másolhatunk.<br>

Másolás nehezítése csak ezen div területére érvényes, weboldal további részére nincs hatással.<br>

Tesztelés előtt, nyissunk meg egy szöveges fájlt. Például: txt fájlt vagy Word fájlt.<br>

Másoljunk ki innen, tetszőleges szöveget vagy szövegrészt, és próbáljuk beilleszteni megnyitott szöveges fájlba. </p>

</div>

Vissza oldal elejére!

Események tiltása.

Témakörök.

Némelyik böngészőben, belépéskor megjelenik letiltás figyelmeztetés.

Néhány esemény letíltása.Teljes weboldalon, vagy kiválasztott területen.

Egér bal és jobb billenytűjének letiltása.

Billentyűzet, azaz, klaviatúra kikapcsolása.

Fotók másolásának megnehezítése, tiltása.

Ezek a fotó és lenyomatminták.

Következő területen tesztelhetjük, megjelenítendő fotókat.

Képernyőmásolat megnehezítése.Egy kiválasztott területen, másolás korlátozása.

Ez egy teszt terület.Mozgassuk ide az egérkurzort. Tartalmi rész addig olvasható, még egérkurzor el nem hagyja, kijelölt területet.

Tartalmi rész megjelenéséhez, engedélyezni kell JavaScript futtatását.

Leütött billentyű kódszámának lekérdezése.

Leütött billentyű kódszáma:

Új oldalra, azaz, a megadott címre léptetés.

Tíltás helyett, kiléptetés a megadott címre.

Az oncopy teszteléshez.

Másolás letiltását, a következő területen tesztelhetjük.

Néhány esemény letíltása.
Teljes weboldalon, vagy kiválasztott területen.

Képernyőmásolat megnehezítése.
Egy kiválasztott területen, másolás korlátozása.

Ez egy teszt terület.
Mozgassuk ide az egérkurzort.
Tartalmi rész addig olvasható,
még egérkurzor el nem hagyja,
kijelölt területet.