• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

[ERLEDIGT] Eingabe: daraus Link erstellen

htmlBeginner93

htmlBeginner93

Neues Mitglied
Hallo zusammen,

das ist mein erster Beitrag - hallo! :)

Ich möchte gerne, dass der User nach Eingabe eines bestimmtes Wortes, einen Link eben mit dieser Eingabe bekommt.

Beispiel:

Standardwert der zu Beginn gesetzt ist: www.google.de/

Eingabe: HalloWelt

Nun soll mir folgendes erstellt werden: www.google.de/HalloWelt

Geht das? Die Eingabe praktisch als Variable abzuspeichern und an einer beliebigen Stelle einzubinden?

Mein Code so far:

HTML: 
<form>
  <input type="text" placeholder="Summoner">
  <button class="btn btn-positive btn-block">Daten abrufen</button>
</form>

Danke für die Hilfe!!
 
Werbung:
m.E. machst du das am Besten mit JavaScript.
So sollte das funktionieren:

Code: 
<a href="" id="link"></a>
<form>
  <input type="text" placeholder="Summoner" onkeyup="createLink(this.value)">
  <button class="btn btn-positive btn-block">Daten abrufen</button>
</form>

<script type="text/javascript">
    var Link="http://www.google.de/";
    function createLink(value){      
        document.getElementById('link').href=Link+value  
        document.getElementById('link').text=Link+value  
    }    
</script>
 
Werbung:
Sieh dir mal jQuery an, das muss man zu beginn nur einbinden und es bietet ein paar tolle functionen. Vorallem was bedienung angeht. So können animationen(z.b. text einblenden, etc) sehr schnell realisiert werden.
Das ansprechen von html tags ist sehr einfach. Man kann sehr gut die css gestaltung anpassen.

bezügl. html ansprechen:
das ist einfach. Wie ich sehe verwendest du class und id. um bei Jquery deine Datei anzusprechen:
jQuery(class).etc... class werden wie bei css mit ".", id's mit "#" geschrieben
bspw. jQuery("#meindiv").css(irgendwas), oder .click etc. der code ist ganz simple
Code: 
<form>
<input type="text" id="eingabe" placeholder="Summoner" />
<button class="btn btn-positive btn-block">Daten abrufen</button>
</form>
<a href="" id="meinlink">link</a>
 
<script>
jQuery("#eingabe").bind ('propertychange input paste', function(){
var url = "http://google.at"; 
var eintrag = jQuery("#eingabe").val();
jQuery("#meinlink").html(url + "/" + eintrag);
jQuery("#meinlink").val("href", url + eintrag);
});
</script>
teste es: http://jsfiddle.net/xfn6csnj/

die erste zeile sieht ev. etwas verwirrend aus. liegt aber am ie
die events sind relativ einfach, angenommen ich habe ein div, und es soll was passieren wenn man drauf klickt:
jQuery("#meindiv").click(function(){
mein eintrag});
oder dieses beispiel, ohne ie kompatib..
jQuery("#eingabe").keyUp(function(){
}), etc
 
In den neueren Versionen von JQuery sprichst du doch nur noch mit einem $ an... Also $(document)...

Hätte ich auch so gemacht... Allerdings braucht er für die Funktion keine Animationen... Und naja... Ich denke JQuery wäre hier ein wenig too much (weil JQuery ja au geladen werden muss ^^)
 
Sorry das liegt daran, dass ich meist mit noConflict schreibe und hier wird es auch ausgeschrieben. Bezügl. Animationen wollte ich es nur schmackhaft machen. Ich als eher unerfahren habe weniger Probleme etwas in jquery zu realisieren als in reinen js
 
Werbung:
Geht mir genauso...
Finde JQuery auch verständlicher... aber wenn ich nur eine kleine Funktion für ein Element brauche, dann setz ich das in JS um...
Weil wegen... JQuery muss auch erst einmal geladen werden und das kostet - wenn auch nicht viel - Zeit ;)
 
jumbo125 schrieb:
Sorry das liegt daran, dass ich meist mit noConflict schreibe und hier wird es auch ausgeschrieben. Bezügl. Animationen wollte ich es nur schmackhaft machen. Ich als eher unerfahren habe weniger Probleme etwas in jquery zu realisieren als in reinen js
Zum Vergrößern anklicken....

Danke aufjedenfall - dass schaue ich mir morgen mal etwas genauer an! Schönes Wochenende!
 
Du musst dich einloggen oder registrieren, um hier zu antworten.

Neueste Beiträge

Zurück
Oben