Проект, который я должен создать, представляет собой базовый калькулятор с инструкциями if / else.Как новичок в JavaScript, я пытаюсь сделать это шаг за шагом и ранее опубликовал это просто, чтобы начать.Основываясь на этих отзывах, я переделал свой код и хочу проверить, есть ли над чем поработать.
Код, который вы видите в JavaScript, - это то место, где я пытаюсь кодировать, следуя приведенным инструкциям:
"... добавить код, чтобы получить все элементы ввода в массив, называемый input (используяdocument.getElementsByTagName) и использовать цикл for для итерации массива. Во время цикла for вы будете использовать инструкцию if, чтобы пропустить элемент ввода, который не является кнопкой, а затем установить обработчик onclick других элементов ввода вФункция, которая вызывает calc внутри него. Убедитесь, что вы передаете значения input [i] .id (или this.id) для вычисления, чтобы рассчитать правильное значение для своей внутренней переменной calcValue. "
Структура Jasmineприкреплен и выдает ошибку: у кнопок базового тестового сайта калькулятора должно быть привязано событие onclick к calc (this.id);так что я знаю, что в моем коде есть ошибки.Буду очень признателен за любые предложения и помощь, которую вы можете мне дать.Спасибо!
var calcu = function(calcValue) {
/* "calc.output.value += "1";"" use to output numbers? */
if (calcValue) {
}
};
var inputs = new Array(document.getElementsByTagName('input'));
for (var i = 0; i <= inputs.length, i++) {
if (inputs[i].type == "button") {
document.getElementById(input.id).onclick = function() {
console.log(calcu(this.id));
}
if (inputs[i].type !== "button") {
return;
}
}
}
<!DOCTYPE html>
<html>
<head>
<!-- test framework css -->
<link rel="stylesheet" href="js/test/lib/jasmine-2.1.3/jasmine.css">
<!-- test framework javascript -->
<script src="js/test/lib/jasmine-2.1.3/jasmine.js"></script>
<script src="js/test/lib/jasmine-2.1.3/jasmine-html.js"></script>
<script src="js/test/lib/jasmine-2.1.3/boot.js"></script>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title>A Basic Calculator (If-Else)</title>
<meta name="description" content="A Basic Calculator">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link href="css/main.css" rel="stylesheet" type="text/css">
</head>
<body>
<div id="content">
<div id="calculator-container">
<!-- The name of the form is "calc" -->
<!-- DO NOT CHANGE THE FORM! Only use external JavaScript files -->
<form name="calc">
<label for="output">A Basic Calculator</label>
<!-- the name of the textbox is "output" -->
<input id="output" name="output" type="text" readonly>
<br>
<input type="button" id="1" value=" 1 ">
<input type="button" id="2" value=" 2 ">
<input type="button" id="3" value=" 3 ">
<input type="button" id="+" value=" + ">
<br>
<input type="button" id="4" value=" 4 ">
<input type="button" id="5" value=" 5 ">
<input type="button" id="6" value=" 6 ">
<input type="button" id="-" value=" - ">
<br>
<input type="button" id="7" value=" 7 ">
<input type="button" id="8" value=" 8 ">
<input type="button" id="9" value=" 9 ">
<input type="button" id="*" value=" x ">
<br>
<input type="button" id="c" value=" C ">
<input type="button" id="0" value=" 0 ">
<input type="button" id="equate" value=" = ">
<input type="button" id="/" value="÷">
</form>
</div>
</div>
<!-- source files -->
<script src="js/vendor/math.js"></script>
<script src="js/ifelse.js"></script>
<script src="js/test/ifelseSpec.js"></script>
</body>
</html>