Typen = direct op pagina

Hey hallo,

Ik wil dus dat als iemand iets bezig is met typen in een text vak,
dat ik dan op juist dezelfde pagina iets kan doen met wat hij net aan het typen is.

Dus stel dat hij dit typt = "CooneRemix"
Dat er dan onder komt direct te staan, zonder te refreshen =

Dan wordt jou link: http://www.cooneremix.onzesite.be

Ik hoop dat iemand me begrijpt en kan helpen. Dankjee

Kijk eens naar de jQuery opties:
keydown, html/val

Dat kun dus via javascript.
Het gemakkelijkst via jQuery omdat dat veel werk bespaart
Dus je moet dus via jQuery een onchange event binden aan je textfield .
Wanneer er dan iets veranderd roept ie de functie aan waarmee je de "Dan word jouw link ..." tekst aanpast.

Maar uit ervaring weet ik al dat een onchange event alleen maar wordt aangeroepen wanneer de gebruiker het textfield verlaat (erbuiten klikken of tab).

Dus wat je het best doet uiteindelijk is een onfocus event linken, die een interval triggert die om de halve seconde de tekst uit je textinput haalt en daarmee je link maakt

En kan je een klein voorbeeld scriptje geven aub?

<input type="text" id="naam" name="naam" />
<span id="tekst"></span>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
    $("#naam").keyup(function () { //Als toets in wordt gedrukt
        $("#tekst").html($("#naam").val()); //Iets met het id tekst veranderen naar de inhoud van de input
    });
</script>

<!DOCTYPE html>
<html>
    <head>
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <script>
        $(document).ready(function() {
            $("#text").keydown(function() {
                $("#jouwlink").html("Dan wordt jou link: http://www." + $("#text").val() + ".onzesite.be");
            });
        });
        </script>
    </head>
    <body>
        <b>Naam:</b><br/>
        <input type="text" id="text"><br/>
        <strong id="jouwlink"></strong>
    </body>
</html>

toevoeging op 13 maart 2013, 16:28:35:
Oh perryz was me al voor, excuses.

Of via key events kan het ook dus

Antonn schreef:

Om het makkelijk te houden.

Dat noem je makkelijk ?

Het is onoverzichtelijk en "moeilijker" te onderhouden.
Daarbij wordt het afgeraden om inline js/css gebruiken.

Zoiets klein? Dat is 1 regeltje dus dat lijkt me totaal niet uit te maken op dit moment.

Robbeing schreef:

Eerdere citaten tonen

Antonn schreef:

Om het makkelijk te houden.

Dat noem je makkelijk ?

Het is onoverzichtelijk en "moeilijker" te onderhouden.
Daarbij wordt het afgeraden om inline js/css gebruiken.

Voor zoiets kleins is inline javascript prima, het wordt juist onoverzichtelijk als je elke kleine js functie apart weg gaat zetten, dan kan je binnen de kortste keren niks meer terugvinden

Eleky schreef:

Eerdere citaten tonen

Robbeing schreef:

Eerdere citaten tonen

Antonn schreef:

Om het makkelijk te houden.

Dat noem je makkelijk ?

Het is onoverzichtelijk en "moeilijker" te onderhouden.
Daarbij wordt het afgeraden om inline js/css gebruiken.

Voor zoiets kleins is inline javascript prima, het wordt juist onoverzichtelijk als je elke kleine js functie apart weg gaat zetten, dan kan je binnen de kortste keren niks meer terugvinden

Inline CSS en Inline JS wil je toch zoveel mogelijk vermijden om eventueel onderhoud makkelijker te maken.

Rik schreef:

Eerdere citaten tonen

Eleky schreef:

Eerdere citaten tonen

Robbeing schreef:

Eerdere citaten tonen

Antonn schreef:

Om het makkelijk te houden.

Dat noem je makkelijk ?

Het is onoverzichtelijk en "moeilijker" te onderhouden.
Daarbij wordt het afgeraden om inline js/css gebruiken.

Voor zoiets kleins is inline javascript prima, het wordt juist onoverzichtelijk als je elke kleine js functie apart weg gaat zetten, dan kan je binnen de kortste keren niks meer terugvinden

Inline CSS en Inline JS wil je toch zoveel mogelijk vermijden om eventueel onderhoud makkelijker te maken.

Dit dus.

Het maakt niet uit hoe klein iets is, als je zegmaar 10 zulke inline-codes hebt, dan wordt het al snel onoverzichtelijk.

In een apart js bestand is veel overzichtelijker en gemakkelijker te onderhouden.
En via inline-js kan je geen gebruik maken van event-listeners

Perryz schreef:

<input type="text" id="naam" name="naam" />
<span id="tekst"></span>
<script type="text/javascript" src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script>
    $("#naam").keyup(function () { //Als toets in wordt gedrukt
        $("#tekst").html($("#naam").val()); //Iets met het id tekst veranderen naar de inhoud van de input
    });
</script>

Je vergeet document ready

Rik schreef:

Eerdere citaten tonen

Eleky schreef:

Eerdere citaten tonen

Robbeing schreef:

Eerdere citaten tonen

Antonn schreef:

Om het makkelijk te houden.

Dat noem je makkelijk ?

Het is onoverzichtelijk en "moeilijker" te onderhouden.
Daarbij wordt het afgeraden om inline js/css gebruiken.

Voor zoiets kleins is inline javascript prima, het wordt juist onoverzichtelijk als je elke kleine js functie apart weg gaat zetten, dan kan je binnen de kortste keren niks meer terugvinden

Inline CSS en Inline JS wil je toch zoveel mogelijk vermijden om eventueel onderhoud makkelijker te maken.

Kwestie van smaak dan denk ik, ik vind het overzichtelijker om simpele 1 lijn js codes (zoals het onchange doorgeven van een waarde) inline te doen, als ik al deze dingen in een apart bestand ga zetten word dit bestand juist onoverzichtelijk omdat je dan allemaal verschillende one liners onder elkaar krijgt