Javascript 将innerHTML与<；输入>；_Javascript_Html

Javascript 将innerHTML与<；输入>；

javascript html

Javascript 将innerHTML与<；输入>；,javascript,html,Javascript,Html,我试图在输入标记上使用innerHTML方法，得到的只是一个空白字符串。这是我正在使用的代码 javascript function setName(ID){ document.getElementById('searchtitle').innerHTML = "Enter " + ID.innerHTML; } HTML <input type="radio" name="searchtype" id="test" value="name" onclick="setName(t

我试图在输入标记上使用innerHTML方法，得到的只是一个空白字符串。这是我正在使用的代码

javascript

function setName(ID){
    document.getElementById('searchtitle').innerHTML = "Enter " + ID.innerHTML;
}

HTML

<input type="radio" name="searchtype" id="test" value="name" onclick="setName(this)">Last Name</input><br/>
<input type="radio" name="searchtype" value="phonenumber" onclick="setName(this)">Phone Number</input><br/>

<label for="inputfield" id="searchtitle" style="font-size:2em;">Enter Last Name</label><br/>
<input type="text" name="inputfield" id="inputfield" style="font-size:2em;"></input>

姓氏

电话号码

输入姓氏

应该发生什么取决于我为输入框选择的标签应该更改的单选按钮。我可以使用label.innerHTML=radio.value，但是这些值是根据我的php代码命名的，并且格式不好（即phonenumber与Phone Number），这就是我尝试使用单选按钮的innerHTML的原因

如果我能得到任何帮助，我都将不胜感激。

如果您想要输入标记的值，请使用

.value

完成编辑

好吧，我知道你在找什么了。首先，你必须修复你的HTML（不要把文本放在输入中…也不要把输入放在标签中）

您使用

这应该是

<input type="radio" name="searchtype" id="test" value="name" onclick="setName(this)"/>Last Name<br/>

<input type="radio" name="searchtype" value="phonenumber" onclick="setName(this)"/>Phone Number<br/>

姓氏

电话号码

首先，在输入周围添加标签。其次，使用getName（this.parentNode）。最后，调用innerText而不是innerHtml

<html>
<head>
<script>
function setName(el){
    document.getElementById('searchtitle').innerHTML = "Enter " + el.innerText;
}
</script>
</head>
<body>
<label><input type="radio" name="searchtype" value="name" onclick="setName(this.parentNode)"/>Last 

Name</label><br/>
<label><input type="radio" name="searchtype" value="phonenumber" onclick="setName(this.parentNode)"/>Phone 

Number</label><br/>

<label for="inputfield" id="searchtitle" style="font-size:2em;">Enter Last Name</label><br/>
<input type="text" name="inputfield" id="inputfield" style="font-size:2em;"></input>
</body>
</html>


函数集合名（el）{
document.getElementById（'searchtitle'）.innerHTML=“Enter”+el.innerText；
}
最后
名称

电话
数字

输入姓氏

您应该将

输入

嵌入

标签

标签中。输入标记应通过

/>

关闭。这是语义HTML。执行此操作时，单击标签激活输入。InnerHTML仅适用于label。它将返回标签值

<label for="inputfield" id="searchtitle" style="font-size:2em;">Enter Last Name
    <input type="text" name="inputfield" id="inputfield" style="font-size:2em;" />
</label>

这是XHTML格式——我相信在HTML5中不再是标准格式了？我不知道。也许这就是我的问题。可能没有innerHTML。不，这不要紧，你的浏览器应该以任何一种方式解析它（向后兼容），但它不会解决你的问题。我认为您是正确的，输入没有innerHTML。这也意味着您可以删除代码中的标记。我认为他不是在试图获取标记的值，而是在获取输入的标签。也就是说，单击单选按钮应将其搜索标题更改为“输入姓氏”或“输入电话号码”。使用该值将给出“输入lastname”和“输入phonenumber”。如果使用.value，则会得到我设置的值phonenumber或name。我试图在和之间访问文本，问题是他试图获取输入的innerHTML，而他真的想要值。不，我认为他真的想要输入的innerHTML，因为他希望搜索标题中的文本与单选按钮的标签匹配。这很好。我仍然希望我知道为什么innerHTML不起作用，但是我可以通过设置id来做到。实际上，这仍然不能解决问题，因为目标是得到这个。您需要获取此的父项。好的，label+this.parentNode+innerText。我认为理论上输入没有innerHtml或innerText，浏览器在内部将其放入标签中。ID是一个等于单选按钮对象的变量，它通过使用单词“this”传递。我可以先使用setName（'Last Name'），然后使用getElementById（ID）。是的，对不起。我已经注意到了这一点，并且编辑了代码本身，但是忘记了编辑注释。好的，我现在知道你在寻找什么（我想），并相应地更新了我的答案。我看到我将文本放入而不是。我想知道我是否可以调用setName（this.previousSibling）并获取的innerHTML？（或者类似的东西，我想对以前的兄弟姐妹有一种方法）不。。。这段代码所做的是获取标签的HTML，该标签的属性whosfor等于输入的ID（标签就是这样工作的）。由于FOR属性通常对其链接到的控件是唯一的，因此这是一个很好的属性选择器解决方案。从那里，它用一个字符串连接它，并将其放入命名标签（searchtitle）的HTML中。

<html>
<head>
<script>
function setName(el){
    document.getElementById('searchtitle').innerHTML = "Enter " + el.innerText;
}
</script>
</head>
<body>
<label><input type="radio" name="searchtype" value="name" onclick="setName(this.parentNode)"/>Last 

Name</label><br/>
<label><input type="radio" name="searchtype" value="phonenumber" onclick="setName(this.parentNode)"/>Phone 

Number</label><br/>

<label for="inputfield" id="searchtitle" style="font-size:2em;">Enter Last Name</label><br/>
<input type="text" name="inputfield" id="inputfield" style="font-size:2em;"></input>
</body>
</html>

<label for="inputfield" id="searchtitle" style="font-size:2em;">Enter Last Name
    <input type="text" name="inputfield" id="inputfield" style="font-size:2em;" />
</label>

console.log(document.getElementById('searchtitle').innerHTML); // returns 'Enter Last Name'