Я пытаюсь динамически изменять высоту и ширину элемента div входными значениями текстового поля. Вот следующий код, который я написал: html code:
<input type="textbox" id="width" name="width">
<input type="textbox" id="height" name="height">
<button type="button" id="btn">ChangeSize</button>
<div id="sketch" style="width:100px;height:100px;border:1px solid black;"></div>
Код Javascript:
fucntion changeWidth()
{
document.getElementById("sketch").style.width = document.getElementById("width").value;
}
function changeHeight()
{
document.getElementById("sketch").style.height = document.getElementById("height").value;
}
documnet.getElementById("btn").addEventListener("click",function(){
changeWidth();
changeHeight();
},false);
Но приведенный выше код работает. Не могли бы вы сообщить мне, какую ошибку я совершил в своем коде.
Заранее спасибо.
Некоторые опечатки и тривиальные ошибки,
function changeWidth() {
document.getElementById("sketch").style.width = document.getElementById("width").value + "px";
}
function changeHeight() {
document.getElementById("sketch").style.height = document.getElementById("height").value + "px"; // append unit to value.
}
document.getElementById("btn").addEventListener("click", function () {
changeWidth();
changeHeight();
}, false);
Для начала вы написали слово "функция" как "fucntion" в строке 1.
Вы также ошибочно написали "документ" как "documnet".
Я не судить. Я - худший заклинатель на Земле.
Значения для ширины и высоты должны быть строкой с "px":
function changeWidth()
{
document.getElementById("sketch").style.width = document.getElementById("width").value + "px";
}
function changeHeight()
{
document.getElementById("sketch").style.height = document.getElementById("height").value + "px";
}
document.getElementById
является правильным, ноdocumnet.getElementById
не является