ICH BEZAHLE DICH: Simples Formular, das sofort einen Text anzeigt und URL Parameter auslesen kann

Hallo Leute, bitte helft mir, wenn ihr die Lösung wisst. Ich wäre auch bereit etwas dafür zu bezahlen. Es ist mir wirklich sehr wichtig! Ich weiß nicht, ob ich in dieser Kategorie richtig bin, also: Meine Beispieldomain lautet http://www.example.com/?user1=Joe&?user2=tina&?user3=daniel (sie enthält URL Parameter) Ich möchte eine Art Formular mit den folgenden 3 Eingabefeldern erstellen: user 1 user 2 user 3 Danach ein Absende-Button Kein Feld soll Pflichtfeld sein. Sobald jemand zum Beispiel folgendes in die Eingabefelder eintippt... user 1 = heinz user 2 = (LEER) user 3 = katja ...soll der folgende Link generiert und direkt (zum Beispiel unter dem Formular) angezeigt werden: http://www.example.com/?user1=heinz&?user2=tina&?user3=katja Da das Eingabefeld "user 2" leer gelassen wurde, wird der URL Parameter der Domain ausgelesen und im Link eingefügt. In diesem Fall wird Tina eingefügt. Es sollen also immer die aktuellen URL-Parameter ausgelesen werden und dementsprechend ein Link angezeigt werden (falls eines der Felder leer gelassen wird). Eigentlich ganz einfach, nur hoffe ich, dass ich es gut erklären konnte und ihr mich versteht. ;)

Der hier verwendete Code

<style> #box{ } #box input, #box p{ width:50vw; height:40px; font-size:30px; text-align:center; margin:10px auto; margin-left:20vw; border-radius:15px; } input[type=text]:focus{ border:5px solid green; outline:none; } input[type=button]:active{ background:red; color:white; } </style> <div id="box"> <p>Eingabe User 1 </p> <input type="text" id="usera"> <p>Eingabe User 2 </p> <input type="text" id="userb"> <p>Eingabe User 3 </p> <input type="text" id="userc"> <input id="senden" type="button" value="Seden"> <div id="info"></div> </div> <br> <br> <br> <br> <br> <br> <br> <div id="openweathermap-widget-15"></div> <script>window.myWidgetParam ? window.myWidgetParam : window.myWidgetParam = []; window.myWidgetParam.push({id: 15,cityid: '2871039',appid: '6f76befc9a1bdd508377833bc185d6cf',units: 'metric',containerid: 'openweathermap-widget-15', }); (function() {var script = document.createElement('script');script.async = true;script.charset = "utf-8";script.src = "//openweathermap.org/themes/openweathermap/assets/vendor/owm/js/weather-widget-generator.js";var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(script, s); })();</script> <script> sen=document.getElementById('senden'); sen.addEventListener('click',function(){ var user1 =document.getElementById('usera').value; var user2 =document.getElementById('userb').value; var user3 =document.getElementById('userc').value; var url ='http://beispiel.de/?user1='+user1+'&user2='+user2+'&user3='+user3; document.getElementById('info').innerHTML='User 1 = '+user1+'<br>User 2 = '+user2+'<br> User 3 = '+user3+'<br> Deine Url '+url+'<br>'; sen.value='Url erstellt'; sen.style.background='rgba(0,199,0,0.9)'; setTimeout(function(){ sen.value="Senden"; sen.style.background='lightgrey'; },2000); }); </script>

Add Comment

* Required information
1000
Drag & drop images (max 3)
Powered by Commentics

Comments

No comments yet. Be the first!