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

0

Я запрограммировал калькулятор и, когда вы нажимаете кнопку, чтобы вставить текст, он не вставляет текст в поле. Плеси помогает мне найти проблему. Вот код:

<html>
<head>
<style type=text/css>
#calculator{
    margin-top:10%;
    margin-left:37%;
    background:cyan;
    color:black;
    height:350px;
    width:350;
    padding:50px;
    text-align:center;
    border:5px dashed blue;
}
#calculator b{
    color:black;
}

</style>
<script type="text/javascript" language="javascript">
var num1 = getElementById("number1");
var num2 = getElementById("number2").value;;
var op = getElementById("operation").value;;
var ans = getElementById("answer").value;
function type1(){
    if(num1 != ""){
        num1 = "1";
    }
}
</script>
</head>
<body>
<div id=calculator>
<center>
<table>
<tr><td><input type="text" value=""  placeholder="Number 1"  id="number1"   readonly="readonly" maxlength="1" tabindex="1"/></td></tr><tr><td>
<input type="text" value=""  placeholder="Operation" id="operation" maxlength="1" readonly="readonly" tabindex="2"/></td></tr><tr><td>
<input type="text" value=""  placeholder="Number 2"  id="number2"   maxlength="1" readonly="readonly" tabindex="3"/><b>=</b></td></tr><tr><td>
<input type="text" value=""  placeholder="Answer"    id="answer"    tabindex="4"   readonly="readonly"/></td></tr>
<table>
<tr><td><input type="button" value="1" onClick="type1()"</td><td><input type="button" value="2" onClick="type2()"</td><td><input type="button" value="3" onClick="type3()"</td></tr>
<tr><td><input type="button" value="4" onClick="type4()"</td><td><input type="button" value="5" onClick="type5()"</td><td><input type="button" value="6" onClick="type6()"</td></tr>
<tr><td><input type="button" value="7" onClick="type7()"</td><td><input type="button" value="8" onClick="type8()"</td><td><input type="button" value="9" onClick="type9()"</td></tr>
<tr><td><input type="button" value="- " onClick="type-()"></td><td><input type="button" value="0" onClick="type0()"></td><td><input type="button" value="+" onClick="type+()"></td></tr>
<tr><td><input type="button" value="X" onClick="typeX()"></td><td><input type="button" value="=" onClick="type=()"></td><td><input type="button" value="/ " onClick="type/()"></td></tr>
</table>
<p><b>NOTE:</b>This widget does not support negative numbers.</p>
</center>
</div>
</body>
</html>

Здесь он находится в действии: http://test342.coffeecup.com/LearningJavascript.html Спасибо за помощь!

  • 0
    пожалуйста, откройте консоль разработчика в вашем браузере. там вы можете увидеть множество ошибок, которые вы можете легко исправить. например: document.getElementById не только getElementById, либо: type2 не определен ...
Теги:
calculator

2 ответа

1

Во-первых, getElementById() - это метод объекта document.

Вместо этого используйте document.getElementById() (см. Ссылку).

Во-вторых, вы не должны объявлять одну функцию для каждой кнопки: вы предпочитаете использовать одну функцию для каждого типа взаимодействия, как число и операцию.

Затем в ваших атрибутах onclick используйте правильную функцию для вызова и измените сфокусированный ввод, если операция выполнена.

В-третьих, не используйте точки с запятой дважды, это не безопаснее :)

1

1 Заменить var num1 = getElementById("number1"); с var num1 = getElementById("number1").value;

Для других кнопок для них нет определенных функций.

2 Замените getElementById на document.getElementById (просто добавив это, у Бидуда это было первое.)

  • 0
    Собираетесь ли вы принять ответ?

Ещё вопросы

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