Почему это не печатает символ в абзаце?

Question

Напишите сценарий, который вводит целочисленный код для символа и отображает соответствующий символ.

Он должен печатать в абзаце.

function character() { 
 
    var input = document.getElementById("input"); 
 
    var code = document.getElementById("output").innerHTML = input; 
 
    output.value = String.fromCharCode(code); 
 
}

<input id="input" type="text" size="10"> 
 
<br> 
 
<input type="button" value="click here" onclick="character()" id="button"> 
 
<br> 
 
<p id="output" ></p>

Answer 1

A P не является элементом формы. Также, если вы используете form.fieldName, вам нужно использовать name="" вместо id=""; в противном случае используйте document.getElementById для всех полей и игнорируйте форму.

Вы должны использовать innerHTML или innerText/textContent для пункта

document.getElementById("output").innerHTML=... 

function character() { 
 
    var form = document.getElementById("form"); 
 
    var code = parseInt(form.input.value,10); // radix 10 to make decimal 
 
    document.getElementById("output").innerHTML = String.fromCharCode(code); 
 
}

<form id="form"> 
 
    <input name="input" type="text" size="10"> 
 
    <br> 
 
    <input type="button" value="click here" onclick="character()" id="button"> 
 
    <br> 
 
    <p id="output" ></p> 
 
</form>

Answer 2

Вы имеете проблему для доступа к элементам внутри формы.

document.getElementById("form").elements['input'] 

Но это работает только с элементами формы, а не с другими элементами HTML.

В этом элементов, вы можете использовать идентификатор или имя, но по историческим причинам.

У вас есть другой путь здесь:

function character() { 
 
    var input = document.getElementById("input"), 
 
     output = document.getElementById("output"); 
 
     output.innerHTML = String.fromCharCode(parseInt(input.value), 10) || ''; 
 
}

<form id="form"> 
 
    <input id="input" type="text" size="10"> 
 
    <br> 
 
    <input type="button" value="click here" onclick="character()" id="button"> 
 
    <br> 
 
    <p id="output" ></p> 
 
</form>

Answer 3

Здесь это работает:

<script> 
function character() { 
var ChrCode = document.getElementById("input").value; 
document.getElementById("output").innerText = ChrCode + " = " + String.fromCharCode(ChrCode); 
//output.value = String.fromCharCode(code); 
} 
</script> 

<input id="input" type="text" size="10"> 
<br> 
<input type="button" value="click here" onclick="character()" id="button"> 
<br> 
<p id="output" >Output</p>