如何使用javascript将文本输入文本字段

Question

I have a form on a wordpress site with a text field for an email adress which looks like this:

<div class="tnp-field tnp-field-email"><label>Email</label><input class="tnp-email" type="email" name="ne" required></div>

I can get the email address from a get parameter (www.domain.com/?email=test@mail.com) like this:

<script type='text/javascript'>
function getUrlVars() {
    var vars = {};
    var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) {
        vars[key] = value;
    });
    return vars;
}

function getUrlParam(parameter, defaultvalue){
    var urlparameter = defaultvalue;
    if(window.location.href.indexOf(parameter) > -1){
        urlparameter = getUrlVars()[parameter];
        }
    return urlparameter;
}

var emailtxt = getUrlParam('email','');

How can I fill the text field with emailtxt ?

Answer 1

You can just set the value of the input field ( HTMLInputElement.value = "value" ).

document.querySelector("input[name=ne]").value = getUrlParam('email','');

 <div class="tnp-field tnp-field-email"><label>Email</label><input class="tnp-email" type="email" name="ne" required></div> <script type='text/javascript'> function getUrlVars() { var vars = {}; var parts = window.location.href.replace(/[?&]+([^=&]+)=([^&]*)/gi, function(m,key,value) { vars[key] = value; }); return vars; } function getUrlParam(parameter, defaultvalue){ var urlparameter = defaultvalue; if(window.location.href.indexOf(parameter) > -1){ urlparameter = getUrlVars()[parameter]; } return urlparameter; } var emailtxt = getUrlParam('email',''); console.log(emailtxt); document.querySelector('input[name=ne]').value = emailtxt; </script> 

Answer 2

You can try DOM id selector:

<input class="tnp-email" type="email" name="ne" id="yourId" required>

document.getElementById("yourId").innerHTML = "Your text";

Answer 3

You can use DOM class name selector like this:

 var x = document.getElementsByClassName("tnp-email");
 x[0].value = "Your value";