jQuery show()

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Junior Developer Low-code

Dit ga je doen Low-code ontwikkeling van software voor landelijk bekende organisaties; Samenwerken in een team van 10 collega's; Opleveren van mooie eindproducten, middels de Agile methodiek; Direct contact met de eindklant over de gewenste oplossingen. Hier ga je werken Als startende IT-professional kom je te werken in de regio van Lelystad bij een organisatie die met toonaangevende klanten uit heel Nederland samen werkt. De producten en diensten van de organisatie bereiken miljoenen Nederlanders. Hierbij komt een grote hoeveelheid informatie kijken en deze moet discreet en veilig verwerkt worden. De processen die hierbij horen worden door het IT team vormgegeven.

Bekijk vacature »

Typescript Developer / Cloud platform

Dit ga je doen (Door)Ontwikkelen van het cloud platform; (Door)Ontwikkelen van microservices; Bouwen van nieuwe functionaliteiten; Verbeteringen aandragen voor het cloud platform; Sparren met de business. Hier ga je werken Onze opdrachtgever, gevestigd in regio Eindhoven, levert een compleet dienstenpakket op het gebied van IT. Zij pakken verschillende (complexe) vraagstukken van grote organisaties op. De sfeer intern is gezellig en informeel. Men houdt van hard werken maar gezelligheid door middel van een borrel of gezamenlijke lunch komt er veel voor. Als Typescript ontwikkelaar word je onderdeel van het team gericht op de (door)ontwikkeling van hun eigen cloud platform welke wordt

Bekijk vacature »

Front-end (Angular) developer

Functie Om bovenstaande ambities waar te kunnen maken zijn ze op zoek naar een Front-end (Angular) developer. Het it-team bestaat momenteel uit de IT Manager, 2 back-end developers, 1 fullstack developer, 1 designer en een DevOps engineer. Ze zijn dus op zoek naar professionals die autonoom en gedisciplineerd aan de slag gaan, en bij aanvang als enige developer met hun Front-end applicaties aan de slag gaat. Wel hebben ze de ambitie om hier snel een 2e developer bij te vinden die jij dan ook zal kunnen aansturen/begeleiden. Je zult aan de slag gaan met het doorontwikkelen van hun bestaande UI

Bekijk vacature »

.NET developer

Functie Heb jij veel kennis van ASP.NET Webforms en wil jij juist de overstap maken naar ASP.NET Core? Wij zijn per direct op zoek naar een ervaren .NET Webdeveloper die met ons samen ons platform wilt herschrijven van ASP.NET Webforms naar ASP.NET Core. Voor jou de unieke kans om met ons samen te innoveren en kennis op te doen van de nieuwste technieken binnen de Microsoft Stack. Wij hebben een development team met 10 IT specialisten bestaande uit onder andere 4 backend .NET developers en twee front-end developers. Wij zijn continu bezig om ons als team en bedrijf te blijven

Bekijk vacature »

(Junior) PHP Ontwikkelaar bij een retail bedrijf i

Bedrijfsomschrijving Ben jij een ervaren PHP ontwikkelaar met een passie voor retail en ICT? Wil jij werken in een team dat zich bezighoudt met het ontwikkelen van uitdagende applicaties voor een groot retailbedrijf in Delft? Dan zijn zij op zoek naar jou! Functieomschrijving Als PHP Ontwikkelaar werk je in een team aan de ontwikkeling van applicaties die door de gehele organisatie worden gebruikt. Je bent verantwoordelijk voor het ontwikkelen, testen en implementeren van deze applicaties. Je werkt hierbij nauw samen met andere ontwikkelaars, projectmanagers en stakeholders binnen de organisatie. Je taken bestaan onder andere uit: Ontwikkelen van nieuwe functionaliteiten en

Bekijk vacature »

Java developer (remote)

Functie Wat ga je doen als Java Developer? Jij als Java ontwikkelaar komt te werken in 1 van onze SCRUM teams. Momenteel werken er zo’n 30 ontwikkelaars binnen onze organisatie waarbij jij de brug slaat tussen het bouwen van verschillende functionaliteiten binnen onze applicaties en deze vervolgens te integreren in onze centrale hub. Je start je dag om 9 uur met een stand up en dan pak je jouw taken op voor de dag. Hieronder een aantal taken die jij zal uitvoeren: – Het bedenken en uitbouwen van features binnen de verschillende applicaties – Onderhouden van CI/CD pipelines – Bezighouden

Bekijk vacature »

API Developer Red Hat Fuse

Dit ga je doen Als API Developer zal je verantwoordelijk zijn voor het: het maken van API's en het correct laten draaien van de API's op het platform. Hierdoor kom je in aanraking met Red Hat Fuse, Springt Boot, 3Scale, Red Hat SSO, Openshift en Azure DevOps; zorgen voor de kwaliteit van de ontwikkeling, integratie en prestaties van de API's; zorgen voor een stabiel integratieplatform. Hier ga je werken Deze organisatie is een toonaangevende speler in de vastgoedbranche en telt momenteel ruim 500 medewerkers. Met meer dan 150 applicaties staat er een complex applicatielandschap dat hoofdzakelijk op OpenShift, Azure en

Bekijk vacature »

Medior Java developer (fullstack)

Wat je gaat doen: Of beter nog, wat wil jij doen? Binnen DPA GEOS zijn we dan ook op zoek naar enthousiaste Java developers om ons development team te versterken. Als Java developer werk je in Agile/Scrum teams bij onze klanten en daarbij kun je eventueel ook andere ontwikkelaars begeleiden in het softwareontwikkelproces. Verder draag je positief bij aan de teamgeest binnen een projectteam en je kijkt verder dan je eigen rol. Je gaat software maken voor verschillende opdrachtgevers in jouw regio. Je bent een professional die het IT-vak serieus neemt en kwaliteit levert. Je leert snel vanwege je diepgaande

Bekijk vacature »

Front-end Developer (HTML/CSS, Angular/React/Vue,

Functie Je zal aan de slag gaan in een klein, hecht team met front-end development experts die de ambitie delen mooi werk te leveren. Samen met hen zal je werken aan het gebruiksvriendelijk en interactief maken van complexe webapplicaties, websites en mobile apps. Je levert klanten wat ze nodig hebben terwijl je actief aan jezelf blijft werken met de ondersteuning vanuit je werkplek. Talen als Javascript programmeer jij vloeiend en je hebt kennis van frameworks als React en Angular. Je zou je het liefst nog veel meer ontwikkelen in verschillende front-end talen. Deze kennis deel je graag met je collega’s,

Bekijk vacature »

C# Ontwikkelaar

Functieomschrijving Voor een software ontwikkelaar in de omgeving van Vught zijn we op zoek naar een gemotiveerde C# ontwikkelaar. Deel jij hun passie voor development en dan vooral in C#.NET? Dan kan dit wel eens jouw droombaan zijn! Jouw werkzaamheden zullen er ongeveer als volgt uit gaan zien Door de wensen van de klant goed te begrijpen ga jij aan de slag dit om te zetten naar passende oplossingen en werk je deze uit tot een sterk eindproduct. Je gaat je bezighouden met de ontwikkeling van webapplicaties en websites, dit doe je door middel van ASP.NET, MVC Frameworks en C#.

Bekijk vacature »

C# .NET Backend Developer HBO Javascript

Samengevat: Deze werkgever is een professionele speler op gebied van IT en E-Commerce. Wil jij werken voor een e-commerce platform? Heb je ervaring met C#, Javascript en Scrum? Vaste baan: C# .NET Developer Backend E-Commerce 3.400 - 4.500 Backend Developer Wij ontwikkelen software voor E-Commerce toepassingen. Ons eigen Content Management systeem biedt een integrale oplossing met diverse ERP software. Onze systemen zijn vaak complex en omvangrijk en draaien bij grote organisaties. Maar ook kleine ondernemingen hebben steeds vaker behoefte aan een vlekkeloos werkende E-Commerce oplossing. Zij bieden een uitdagende werkomgeving met gezellige collega's. Je krijgt veel vrijheid en er is

Bekijk vacature »

Lead C++ Developer

De rol van Lead C++ Developer Als Lead C++ developer bij KUBUS word je verantwoordelijk voor het implementatie design van requirements en de software architectuur van de desktop applicaties van BIMcollab, ons platform voor 3D model-validatie en issue-management bedoeld om de kwaliteit van 3D design-modellen voor gebouwen te verbeteren. Betere 3D modellen leiden tot betere gebouwen, dus zo draag je bij aan verduurzaming van de gebouwde omgeving met slimmer gebruik van materialen, minder verspilling en energie-efficiënte gebouwen. Een goede gebruikerservaring staat bij ons hoog in het vaandel; we gaan in onze ontwikkeling voor innovatie en kwaliteit. In je rol als

Bekijk vacature »

Software developer - C Sharp

Functie omschrijving Heb jij interesse in het programmeren en ontwikkelen van software? En heb jij enige ervaring met Oracle databases en PL/SQL? Wij zijn voor een leuke opdrachtgever in omgeving Naaldwijk op zoek naar een software ontwikkelaar die graag werkt met C#, JAVA of Oracle. Wij zoeken iemand die breed inzetbaar is en die aan veel verschillende applicaties wilt werken. Als software developer werk je met je collega's samen in een leuk en informeel team aan het (her)ontwerpen van bedrijfssystemen. Je houdt je bezig met het ontwikkelen van REST API's en je onderhoudt applicaties in Oracle PL/SQL en APEX. Vind

Bekijk vacature »

Software ontwikkelaar

Ben jij graag bezig met verschillende projecten? Vind jij beleving van klanten én medewerkers ook belangrijk? Wij zijn vanwege de doorontwikkeling van het applicatielandschap van onze opdrachtgever op zoek naar een fulltime software ontwikkelaar. Omschrijving Jij en jouw collega’s zijn verantwoordelijk voor de continuïteit en waarborging van het applicatielandschap. Om de processen vloeiend te laten verlopen is software ontwikkeling daarom van essentieel belang. Onze opdrachtgever doet dit voornamelijk zelf, met door hun eigen ontwikkelde applicaties. Dit betekent dat jij: functionele eisen vertaalt naar gebruiksvriendelijke software; tijdens SCRUM sessies advies geeft over het te bouwen ontwerp; nieuwe software ontwikkelt en het

Bekijk vacature »

Oracle Apex developer

Bedrijfsomschrijving My client is a technology company based in Den Bosch, the Netherlands. They specialize in providing innovative software solutions to clients, and they are currently looking for an experienced Oracle Apex developer to join the IT team. Functieomschrijving As an Oracle Apex developer, you will be responsible for designing, developing, and maintaining web-based applications using Oracle Apex. You will work closely with project managers, business analysts, and other developers to ensure that clients' needs are met and that the software solutions are of the highest quality. Responsibilities: Design, develop, and maintain Oracle Apex applications. Work with project managers and

Bekijk vacature »

Pagina: 1 2 volgende »

John Cena

John Cena

02/02/2011 10:29:31
Quote Anchor link
Dit werkt niet:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
    <button id="button1">Show it</button>
    <p style="display: none">Hello  2</p>
    <script>
        $("button1").click(function () {
        $("p").show("slow");
        });
    </script>

en dit wel:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
    <button>Show it</button>
    <p style="display: none">Hello  2</p>
    <script>
        $("button").click(function () {
        $("p").show("slow");
        });
    </script>


Waarom? En hoe krijg ik voorbeeld 1 aan het werk zodat ik met meerdere buttons met een eigen ID kan werken?
 
PHP hulp

PHP hulp

24/11/2024 10:14:39
 
- Ariën  -
Beheerder

- Ariën -

02/02/2011 10:31:28
Quote Anchor link
Ik mis:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
$(document).ready(function(){
 
John Cena

John Cena

02/02/2011 10:32:31
Quote Anchor link
Het is ook een simpel snelle test. Waar zou dit volgens jou bij moeten staan? :)
Want, de onderste regel werkt wel, zonder die code.

Groeten :)
 
- Ariën  -
Beheerder

- Ariën -

02/02/2011 10:33:51
Quote Anchor link
om je hele jQuery code heen ...

Basiskennis jQuery...

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
      
 $("#button").click(function () {

Als de knop vaker voorkomt, moet je een class gebruiken:

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
$(".button").click(function () {
Gewijzigd op 02/02/2011 10:35:26 door - Ariën -
 
Ozzie PHP

Ozzie PHP

02/02/2011 10:35:45
Quote Anchor link
Bij voorbeeld 1:

$("button1")

moet zijn

$("#button1")
 
Chris -

Chris -

02/02/2011 10:38:44
Quote Anchor link
Zou toch nog eens naar de basis van selectors kijken!
 
John Cena

John Cena

02/02/2011 10:41:11
Quote Anchor link
Ok, heb het aangepast, en het werkt nu inderdaad.
Als ik jou code erom heen zet Aar werkt het niet meer.

Nu wil ik echter dat button1 P1 opent, button2 P2, etc.

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
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

    <button id="button1">Show it 1</button>
    <p id="p1" style="display: none">Hello  1</p>
    <button id="button2">Show it 2 </button>
    <p id="p2" style="display: none">Hello  2</p>
    <button id="button3">Show it 3</button>
    <p id="p3" style="display: none">Hello  3</p>
    
    <script>
        $("#button1").click(function () {
        $("#p1").show("slow");
        });
    </script>
  
    

Hoe verwerk ik daar nu in dat hij automatisch de verschillende buttons en P's pakt?

@Aar, kan het zijn omdat ik geen body etc erin heb staan dat het daarom niet werkt?
 
Ozzie PHP

Ozzie PHP

02/02/2011 10:48:15
Quote Anchor link
Chi Lion op 02/02/2011 10:41:11:
Hoe verwerk ik daar nu in dat hij automatisch de verschillende buttons en P's pakt?
Wat bedoel je nou? Gewoon de code kopieren en 1 vervangen door 2 en 3???? Toch niet zo moeilijk?

Chi Lion op 02/02/2011 10:41:11:
@Aar, kan het zijn omdat ik geen body etc erin heb staan dat het daarom niet werkt?
Je hebt toch wel een body in je pagina staan neem ik aan?
 
John Cena

John Cena

02/02/2011 10:50:48
Quote Anchor link
Nee, ik wat ik gepost heb ik alle code in de pagina, ik ben eerst puur aan het testen voor ik verder ga. Zal het erbij inzetten.

In feite zouden het oneindig veel buttons en oneindig veel P's kunnen zijn.
de ID's van button en P worden auto gegenereerd, alleen moet hij snappen dat het getal bij button ook het getal bij P wordt zeg maar.

Zo iets duidelijker?
 
Lauren Zonneveld

Lauren Zonneveld

02/02/2011 10:57:11
Quote Anchor link
In jouw voorbeeld kun je simpelweg next() gebruiken:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
<button>Show it 1</button>
<p style="display: none">Hello  1</p>
<button>Show it 2 </button>
<p style="display: none">Hello  2</p>
<button>Show it 3</button>
<p style="display: none">Hello  3</p>

<script type="text/javascript">
$("button").click(function () {
    $(this).next('p').show("slow");
});
</script>
 
John Cena

John Cena

02/02/2011 10:58:35
Quote Anchor link
Maar, wat als ik nu wil dat de vorige weer gesloten wordt?

Toevoeging op 02/02/2011 11:00:42:

Wacht, dat is me gelukt nu:
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
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>
    </head>
    <body>
        <button>Show it 1</button>
        <p style="display: none">Hello  1</p>
        <button>Show it 2 </button>
        <p style="display: none">Hello  2</p>
        <button>Show it 3</button>
        <p style="display: none">Hello  3</p>

        <script type="text/javascript">
        $("button").click(function () {
        $(this).next('p').show("slow");
        $(this).prev('p').hide("slow");
        });
        </script>
    </body>
</html>


Maar waar gooi ik nu mijn document.ready in?
 
Ozzie PHP

Ozzie PHP

02/02/2011 11:05:27
Quote Anchor link
Je moet met id's werken. Via php geef je een id mee aan je p's en in je javascript.

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
<?php for($i=1;$i<11;$i++) {
  echo '<p id="p'.$i.'" style="display: none">Hello '.$i.'</p>';
  echo '<a href="#" id="button '.$i.'">klik '.$i.'</a>;
}
<
script type="text/javascript">
for($i=1;$i<11;$i++) {
  ?>

  $("#button <?php echo $i; ?>").click(function () {
    $("#p<?php echo $i; ?>").show("slow");
  });
  <?php
}
?>

</script>
Gewijzigd op 02/02/2011 11:10:09 door Ozzie PHP
 
John Cena

John Cena

02/02/2011 11:09:05
Quote Anchor link
Ozzie, ik denk dat de oplossing die ik nu heb net zo goed werkt? (zie post boven jou)
Jij enige idee waar ik Aar zijn document.ready in moet pleuren, aangezien je die zelf ook niet gebruikt...
 
Lauren Zonneveld

Lauren Zonneveld

02/02/2011 11:10:56
Quote Anchor link
Met document ready ga je pas functies uitvoeren als het volledige document is geladen. Als je dus je javascript in de head zet gebruik je document ready. In jouw geval komt de javascript na de HTML waar het naar verwijst dus is document ready niet nodig.

Als je het netjes wilt doen plaats je JS in de head, zonder document.ready zal je op deze manier een foutmelding krijgen:
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
22
23
<html>
    <head>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script>

        <script type="text/javascript">
        $(document).ready(function(){
            $("button").click(function () {
                $('p').hide("slow");
                $(this).next('p').show("slow");
            });
        });
        </script>

    </head>
    <body>
        <button>Show it 1</button>
        <p style="display: none">Hello  1</p>
        <button>Show it 2 </button>
        <p style="display: none">Hello  2</p>
        <button>Show it 3</button>
        <p style="display: none">Hello  3</p>
    </body>
</html>
Gewijzigd op 02/02/2011 11:11:23 door Lauren Zonneveld
 
Ozzie PHP

Ozzie PHP

02/02/2011 11:11:09
Quote Anchor link
Ik heb m nog wat aangepast... nu heb je een link / button voor iedere p... Die document ready kun je om je javascript heen zetten.
Gewijzigd op 02/02/2011 11:12:40 door Ozzie PHP
 
John Cena

John Cena

02/02/2011 11:13:34
Quote Anchor link
Perfect all of u guys, tnx alot!
 

02/02/2011 14:26:14
Quote Anchor link
Dit kan veel generieker worden aangepakt: voorbeeld.
Bij Ozzie's script krijg je dus steeds maar weer dezelfde stuk code. Hier is al een opzet van hoe het beter kan, in principe kan het nog verder worden uitgewerkt.
 
Ozzie PHP

Ozzie PHP

02/02/2011 15:01:59
Quote Anchor link
Karl, in jouw voorbeeld vervangt ie telkens de ene p door de andere terwijl ts volgens mij wil dat ie ze afzonderlijk kan tonen en verbergen. Bijvoorbeeld dat je tegelijkertijd p1 en p3 toont. Kan dat in jouw opzet ook? Wel mooi gemaakt hoor :)

(is <button> een normaal html element?)
 

02/02/2011 16:02:47
Quote Anchor link
Ja, ik weet niet precies wat hij wilt.
Van die show() kan je toggle() maken. De methode eronder kan je dan weghalen.
Button is al minimaal vanaf html 4 aanwezig.
 
Ozzie PHP

Ozzie PHP

02/02/2011 16:05:59
Quote Anchor link
is dat ook een xhtml element?

Ben het nog nooit tegengekomen... of anders gezegd, ik heb het nooit gebruikt.
 

02/02/2011 16:11:48
Quote Anchor link
<!ENTITY % inline.forms "input | select | textarea | label | button">
http://www.w3.org/TR/xhtml1/dtds.html#a_dtd_XHTML-1.0-Strict
Ja dus.
 

Pagina: 1 2 volgende »



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.