Я пытаюсь динамически изменить размер элемента div

0

Я пытаюсь динамически изменять высоту и ширину элемента 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);

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

Заранее спасибо.

  • 0
    Пожалуйста, проверьте ответ и скрипку, размещенную ниже
  • 0
    document.getElementById является правильным, но documnet.getElementById не является
Теги:

3 ответа

2

Некоторые опечатки и тривиальные ошибки,

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

DEMO

1

Для начала вы написали слово "функция" как "fucntion" в строке 1.

Вы также ошибочно написали "документ" как "documnet".

Я не судить. Я - худший заклинатель на Земле.

  • 0
    Также документ написан с ошибкой
  • 0
    Да, здесь я ошибся, но в моем коде это правильно. Хотя это не работает.
Показать ещё 1 комментарий
0

Значения для ширины и высоты должны быть строкой с "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";
}

Ещё вопросы

Сообщество Overcoder
Наверх
Меню