Autor Zpráva
AM
Profil *
#1 · Zasláno: 30. 4. 2007, 14:33:12
Odpovědět Citovat
Přítomnost myši nad elementem
Petr Tichý
Profil
#2 · Zasláno: 30. 4. 2007, 14:35:14
Odpovědět Citovat
OnMouseOver?
AM
Profil *
#3 · Zasláno: 30. 4. 2007, 14:39:25
Odpovědět Citovat
Chtěl bych se zeptat, lze nějak zjistit pomocí JavaScriptu, jestli se v daný okamžik nachází myš nad určitým elementem? např. <input type="text" onkeypress="if(this.MysJeNadTimhle()) { alert('Odjed s mysi, at vidis, co pises!'); }" />
Časová prodleva: 10 dní
Petroff
Profil
#4 · Zasláno: 10. 5. 2007, 12:48:09
Odpovědět Citovat
Zkus si oba způsoby (alert okno se musí zavřít což je nepraktické a zdržuje)
Pokud máš formulář s hromadou textových polí které bys chtěl mít takhle ošetřené, tak je nejlepší zavolat JS funkci, která projde všechny INPUTy a nastaví jim onmouseover,onmouseout a keypress.

<html><head><meta http-equiv="Content-Type" content="text/html; charset=RTF-8"></head>
<body>
<form>
<LABEL>Varování bude v ALERT okně: </LABEL>
<INPUT type=text onmouseover="this.signal=true" onmouseout="this.signal=false" onkeydown="if (this.signal) alert('Odjeď s myší')">
<BR>
<LABEL>Varování bude v INPUT boxu: </LABEL>
<INPUT type=text onmouseover="this.signal=true;this.old=value" onmouseout="this.style.color='black';this.value=this.old;this.signal=f alse"
onkeydown="if(!this.signal)return true;this.style.color='red';this.value='Odjeď s myší';return false">
<BR>
</form>
</body></html>
Petroff
Profil
#5 · Zasláno: 10. 5. 2007, 16:42:29
Odpovědět Citovat
Nejjednodušší řešení.
Do hlavičky souboru vložíš skript a hotovo - všechny vstupní políčka jsou ošetřeny.Případně ho dej do samostatného souboru a jediná úprava je vložení řádku <script src="xxx.js"></script>.

<html><head><meta http-equiv="Content-Type" content="text/html; charset=RTF-8">
<style>
BODY{margin:2em} LABEL{width: 15ex; font-size:1em} INPUT{width: 30ex; font-size:1em } BUTTON{width: 100%; font: 1em Arial }
</style>

<script>
var upozorneni='Odjeď s myší'; /* Při využívání INPUTů délka textu s ohledem na nejkratší vstupní řádek - případně použít užší písmo */

function varovat() {
if (!this.signal) return true;
this.signal='vratit';
this.style.color='red';
this.style.fontWeight='bold'; /* Vynecháním zúžení písma */
this.value=upozorneni;
return false;
}

function vratit() {
if (this.signal=='vratit') {
this.style.color='black';
this.value=this.old_text;
this.style.fontWeight='normal';
}
this.signal=false;
}

function mys_nad() {
this.old_text=this.value;
this.signal=true;
}

function all_alert(){
for(var n=0,inputs=document.getElementsByTagName("INPUT");n<inputs.length;n++) {
var i=inputs[n];
if (i.type!="text") continue;
i.onmouseover= function(e){this.signal=true}
i.onmouseout = function(e){this.signal=false}
i.onkeydown = function(){if (this.signal) alert(upozorneni)}
}
}

function all_napis(){
for(var n=0,inputs=document.getElementsByTagName("INPUT");n<inputs.length;n++) {
var i=inputs[n];
if (i.type!="text") continue;
i.onmouseover= mys_nad;
i.onmouseout = vratit;
i.onkeydown = varovat;
}
}
/*===================== VYBER SI ZE DVOU VARIANT - KÓD MUSÍ BÝT V SEKCI HEAD =======================*/
/* window.onload=all_napis; /* buď 1. tohle + function all_napis() + varovat() + vratit() + mys_nad() + upozorneni */
/* window.onload=all_alert; /* nebo 2. tohle + function all_alert() + upozorneni */
/*==================================================================== ==================*/
</script>

</head><body><form>
<TABLE>
<TR>
<TD><LABEL>Zadej A1</LABEL></TD>
<TD><INPUT type=text onmouseover="this.signal=true" onmouseout="this.signal=false" onkeydown="if (this.signal) alert(upozorneni)"></TD>
</TR>
<TR>
<TD><LABEL>Zadej A2</LABEL></TD>
<TD><INPUT type=text onmouseover="this.signal=true;this.old=value" onmouseout="this.style.color='black';this.value=this.old;this.signal=f alse"
onkeydown="if(!this.signal)return true;this.style.color='red';this.value='Odjeď s myší';return false"></TD>
</TR>
<TR><TD><LABEL>Zadej B</LABEL></TD><TD><INPUT type=text></TD></TR>
<TR><TD><LABEL>Zadej C</LABEL></TD><TD><INPUT type=text></TD></TR>
<TR><TD><LABEL>Zadej D</LABEL></TD><TD><INPUT type=text></TD></TR>
<TR><TD><LABEL>Zadej E</LABEL></TD><TD><INPUT type=text></TD></TR>
<TR><TD><LABEL>Zadej F</LABEL></TD><TD><INPUT type=text></TD></TR>
<TR><TD><LABEL>Zadej G</LABEL></TD><TD><INPUT type=text></TD></TR>
<TR><TD><LABEL>Zadej H</LABEL></TD><TD><INPUT type=text></TD></TR>
<TR><TD><LABEL>Zadej I</LABEL></TD><TD><INPUT type=text></TD></TR>
<TR><TD><LABEL>Zadej J</LABEL></TD><TD><INPUT type=text></TD></TR>
<TR><TD COLSPAN="2"><HR></TD></TR>
<TR><TD COLSPAN="2"><BUTTON type="button" onclick="all_alert()">Ošetřit všechny INPUTy pomocí ALERT</BUTTON></TD></TR>
<TR><TD COLSPAN="2"><BUTTON type="button" onclick="all_napis()">Ošetřit všechny INPUTy pomocí NÁPISu</BUTTON></TD></TR>
</TABLE>
</form></body></html>
Časová prodleva: 5 měsíců
Petroff
Profil
#6 · Zasláno: 8. 10. 2007, 11:26:05
Odpovědět Citovat
Podivný překlep:
místo <meta http-equiv="Content-Type" content="text/html; charset=RTF-8">
patří <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
(případně kodování kt. používáš)
Časová prodleva: 13 let
Toto téma je uzamčeno. Odpověď nelze zaslat.

0