Select event

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Ben Van de Voorde

Ben Van de Voorde

10/05/2011 11:32:47
Quote Anchor link
Hallo,

Misschien een hele stomme vraag maar hoe kan ik makkelijk een select event maken met de volgende html code eventueel met javascript maar heb geen idee.

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
<select>
<option>1</option>
<option>1</option>
<option>1</option>
<option>1</option>
</select>


Wat ik wil is als je optie 1 selecteer dat er een afbeelding word geopend in het scherm, hoe doe ik dit zonder <img src=''> te gebruiken?
Gewijzigd op 10/05/2011 11:32:55 door Ben Van de Voorde
 
PHP hulp

PHP hulp

28/03/2024 10:16:40
 
Vincent Huisman

Vincent Huisman

10/05/2011 11:36:38
Quote Anchor link
kijk eens naar jQuery change()
 
Ben Van de Voorde

Ben Van de Voorde

10/05/2011 11:42:12
Quote Anchor link
Erg mooi even bij favorieten gezet, niet wat ik bedoel helaas!
 
Joren de Wit

Joren de Wit

10/05/2011 12:27:27
Quote Anchor link
Bart Wout op 10/05/2011 11:32:47:
Wat ik wil is als je optie 1 selecteer dat er een afbeelding word geopend in het scherm, hoe doe ik dit zonder <img src=''> te gebruiken?

De <img> tag is de enige manier om een image in HTML weer te geven, daar kun je dus niet omheen. Als je alle betreffende <img> een style geeft die ervoor zorgt dat ze niet weergegeven worden (display:none), kun je met javascript deze style later veranderen zodra een optie geselecteerd is...
 
Ben Van de Voorde

Ben Van de Voorde

10/05/2011 13:28:50
Quote Anchor link
Humm precies ok, maar hoe maak ik een select nou, zodra je het selecteerd dat je iets submit?
Gewijzigd op 10/05/2011 13:32:00 door Ben Van de Voorde
 
Vincent Huisman

Vincent Huisman

10/05/2011 13:41:21
 
Joakim Broden

Joakim Broden

10/05/2011 14:04:21
Quote Anchor link
Paar mogelijkheden:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
<script type="text/javascript">
$('#option').change(function() {
    var value = $(this).val();
    $('#image').attr('src', value);
});
</script>

<select name="option" id="option">
    <option value="images/image1.jpg">Afbeelding 1</option>
    <option value="images/image2.jpg">Afbeelding 2</option>
    <option value="images/image3.jpg">Afbeelding 3</option>
</select>
<img src="images/image.jpg" alt="Afbeelding" />


Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<script type="text/javascript">
$('#option').change(function() {
    var value = $(this).val();

    $('#image img').hide();
    $('#image .' + value).show();
});
</script>

<select name="option" id="option">
    <option value="image">Afbeelding</option>
    <option value="image1">Afbeelding 1</option>
    <option value="image2">Afbeelding 2</option>
    <option value="image3">Afbeelding 3</option>
</select>
<div id="image">
    <img src="images/image.jpg" alt="Afbeelding" class="image">
    <img src="images/image1.jpg" alt="Afbeelding 1" class="image1">
    <img src="images/image2.jpg" alt="Afbeelding 2" class="image2">
    <img src="images/image3.jpg" alt="Afbeelding 3" class="image3">
</div>


Je kunt het op allerlei manieren doen via javascript (Deze scripts zijn niet getest).

Als je het via php doet kijk je gewoon naar de $_POST van de select.
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.