Wie erhalte ich den Wert eines Texteingabefeldes mit JavaScript?

//creates a listener for when you press a key
window.onkeyup = keyup;

//creates a global Javascript variable
var inputTextValue;

function keyup(e) {
  //setting your input text to the global Javascript Variable for every key press
  inputTextValue = e.target.value;

  //listens for you to press the ENTER key, at which point your web address will change to the one you have input in the search box
  if (e.keyCode == 13) {
    window.location = "http://www.myurl.com/search/" + inputTextValue;
  }
}

Sehen Sie diese Funktion in Codepen.

Ich würde eine Variable erstellen, um die Eingabe wie folgt zu speichern:

var input = document.getElementById("input_id").value;

Und dann würde ich einfach die Variable verwenden, um den Eingabewert zur Zeichenkette hinzuzufügen.

= "Your string" + input;

Sie können auch durch Markennamen aufrufen: form_name.input_name.value;So haben Sie den bestimmten Wert der bestimmten Eingabe in einem bestimmten Formular.

Sie sollten Folgendes eingeben können:

var input = document.getElementById("searchTxt");

function searchURL() {
     window.location = "http://www.myurl.com/search/" + input.value;
}

<input name="searchTxt" type="text" maxlength="512" id="searchTxt" class="searchField"/>

Ich bin sicher, dass es bessere Möglichkeiten gibt, dies zu tun, aber diese scheint in allen Browsern zu funktionieren, und es erfordert nur ein Minimum an JavaScript, um Änderungen vornehmen, verbessern und bearbeiten zu können.

Probier diese

<input type="text" onKeyup="trackChange(this.value)" id="myInput">
<script>
function trackChange(value)
{

window.open("http://www.google.co.in/search?output=search&q="+value)

}
</script>

In Chrome und Firefox getestet:

Wert nach Element-ID abrufen:

<input type="text" maxlength="512" id="searchTxt" class="searchField"/>
<input type="button" value="Get Value" onclick="alert(searchTxt.value)">

Wert im Formularelement einstellen:

<form name="calc" id="calculator">
  <input type="text" name="input">
  <input type="button" value="Set Value" onclick="calc.input.value='Set Value'">
</form>

https://jsfiddle.net/tuq79821/

Schauen Sie sich auch eine JavaScript-Taschenrechner-Implementierung an: http://www.4stud.info/web-programming/samples/dhtml-calculator.html

UPDATE von @ bugwheels94: Wenn Sie diese Methode verwenden, beachten Sie dieses Problem .

Sie können die form.elements verwenden, um alle Elemente in einem Formular abzurufen. Wenn ein Element eine ID hat, kann es mit .namedItem ("id") gefunden werden. Beispiel:

var myForm = document.getElementById("form1");
var text = myForm.elements.namedItem("searchTxt").value;
var url = "http://www.myurl.com/search/" + text;

Quelle: w3schools

einfache js

function copytext(text) {
    var textField = document.createElement('textarea');
    textField.innerText = text;
    document.body.appendChild(textField);
    textField.select();
    document.execCommand('copy');
    textField.remove();
}

<input id="new" >
    <button  onselect="myFunction()">it</button>    
    <script>
        function myFunction() {
            document.getElementById("new").value = "a";    
        }
    </script>

Sie können onkeyup verwenden, wenn Sie mehr Eingabefeld haben. Angenommen, Sie haben vier oder input.then document.getElementById('something').value ist ärgerlich. Wir müssen 4 Zeilen schreiben, um den Wert des Eingabefeldes abzurufen.

Sie können also eine Funktion erstellen, die beim Keyup- oder Keydown-Ereignis Werte in einem Objekt speichert.

Beispiel:

<div class="container">
    <div>
        <label for="">Name</label>
        <input type="text" name="fname" id="fname" onkeyup=handleInput(this)>
    </div>
    <div>
        <label for="">Age</label>
        <input type="number" name="age" id="age" onkeyup=handleInput(this)>
    </div>
    <div>
        <label for="">Email</label>
        <input type="text" name="email" id="email" onkeyup=handleInput(this)>
    </div>
    <div>
        <label for="">Mobile</label>
        <input type="number" name="mobile" id="number" onkeyup=handleInput(this)>
    </div>
    <div>
        <button onclick=submitData()>Submit</button>
    </div>
</div>

javascript:

<script>
    const data={ };
    function handleInput(e){
        data[e.name] = e.value;
    }
    function submitData(){
        console.log(data.fname); //get first name from object
        console.log(data); //return object
    }
</script>