如何使用javascript在文本字段中输入文本答案

【问题标题】：How to input text into text field with javascript如何使用javascript在文本字段中输入文本
【发布时间】：2018-08-06 22:13:29
【问题描述】：

我在 wordpress 网站上有一个表单，其中包含一个电子邮件地址的文本字段，如下所示：

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

我可以像这样从 get 参数 (www.domain.com/?email=test@mail.com) 获取电子邮件地址：

<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','');

如何使用 emailtxt 填充文本字段？

【问题讨论】：

标签： javascript variables input textfield getparameter

【解决方案1】：

您可以只设置输入字段的值 (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>

【讨论】：

谢谢，但我怎样才能解决正确的输入字段？它没有 ID，因为我是用插件创建的。
您可以使用class 或name 属性
@user363808 您可以使用输入字段的名称。 document.querySelector('input[name=ne]')
请注意，在这种情况下querySelector 将获得第一个input。
现在可以使用了。我真是个白痴。我在标题中有我的javascript代码。当然，如果没有加载表单，它就无法工作，但我觉得很尴尬。感谢您的帮助。

【解决方案2】：

你可以试试 DOM id 选择器：

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

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

【讨论】：

谢谢，但遗憾的是我无法在文本字段中添加 ID，因为它是由插件生成的。这里有一种使用类的方法吗？
是的，你可以，但你必须小心，因为类选择器将返回所有类名匹配的 DOM 元素。

【解决方案3】：

你可以像这样使用 DOM 类名选择器：

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

【讨论】：

遗憾的是这也不起作用。到目前为止，我没有设法将 getElement 与任何建议的方法一起使用。