Overliggende div lijkt niet ontop
Ik heb een webpagina met een aantal inputvelden.
Hieroverheen komt met een bepaalde actie een div te liggen.
Binnen deze div bevindt zich ook een inputveld, die hierdoor over een ander inputveld komt te liggen
Echter, als ik in het inputveld in de div div klik, ten hoogte van het inputveld die eronder ligt, wordt er op het inputveld eronder gefocust.
Hoe kan ik dit verhelpen?
- Z-index aanpassen helpt niet
- <div onclick="return false;"> helpt niet
- <input onclick="return false;" /> helpt niet
Hoe kan ik dit verhelpen?
Gewijzigd op 07/04/2011 13:53:54 door Wout van der Burg
Gesponsorde koppelingen:
Code (php)
1
2
3
2
3
<?php
echo "<input type=\"text\" onfocus=\"showZoekert('".$titel."','".$artgroep."','".$dbveld."','".$conditions."');\" onclick=\"showZoekert('".$titel."','".$artgroep."','".$dbveld."','".$conditions."');\" id=\"".$titel."oms\" name=\"".$titel."oms\" style=\"width:290px;\" readonly=\"true\" value=\"".$oms."\" />";
?>
echo "<input type=\"text\" onfocus=\"showZoekert('".$titel."','".$artgroep."','".$dbveld."','".$conditions."');\" onclick=\"showZoekert('".$titel."','".$artgroep."','".$dbveld."','".$conditions."');\" id=\"".$titel."oms\" name=\"".$titel."oms\" style=\"width:290px;\" readonly=\"true\" value=\"".$oms."\" />";
?>
Met bovenstaand inputveld wordt d.m.v. AJAX een div zichtbaar gemaakt en gevuld met onderstaande div.
Code (php)
1
2
3
4
5
6
7
8
2
3
4
5
6
7
8
<?php
<div style="z-index:1;width:100%;height:100%;">
<td>
<input type="text" id="arttrefwoord" name="arttrefwoord" style="width:180px" onkeyup="showResult(this.value);" /> <a href="">Voeg tekst toe</a>
</td>
<td><div id="result"></div></td>
</div>
?>
<div style="z-index:1;width:100%;height:100%;">
<td>
<input type="text" id="arttrefwoord" name="arttrefwoord" style="width:180px" onkeyup="showResult(this.value);" /> <a href="">Voeg tekst toe</a>
</td>
<td><div id="result"></div></td>
</div>
?>
Toevoeging op 07/04/2011 14:31:27:
Bovenstaande afbeelding geeft de situatie weer.
In eerste instantie heb ik nu op het inputveld naast de tekst 'egelaar' geklikt.
Vervolgens komt het divje eroverheen.
Als ik nu in het veld klik onder het inputveld naast 'voeg tekst toe', zet hij de focus op het veld eronder.
Toevoeging op 07/04/2011 15:50:29:
Ik heb het opgelost door in javascript te kijken of het divje al geopend is (display:block). Hiertoe heb ik de vervolgacties afgebroken en de focus op het terfwoordveld laten zetten รก la;
Code (php)
Gewijzigd op 07/04/2011 14:33:33 door Wout van der Burg
