evaluate.onclick = function() {
var first = document.getElementById('inp_1').value;//первое число
var second = document.getElementById('inp_2').value;//второе число
if(isNaN(first) == false && isNaN(second) == false //условие проверки ввода числа
&& first != "" && second != ""){
var res = Number(first) + Number(second);//
document.getElementById('fg').value = res;//
}else{
alert("введите число");//
}
}
function App() {
const [number1, setNumber1] = useState(0);
const [number2, setNumber2] = useState(0);
const [total, setTotal] = useState(number1 + number2);
function calculateTotal() {
setTotal(number1 + number2);
}
return (
<div className="App">
<h1>Adding Two Numbers</h1>
<div className="number-inputs">
<input
type="number"
value={number1}
onChange={e => setNumber1(+e.target.value)}
placeholder="0"
/>
<input
type="number"
value={number2}
onChange={e => setNumber2(+e.target.value)}
placeholder="0"
/>
</div>
<button onClick={calculateTotal}>Add Them!</button>
<h2>{total}</h2>
</div>
);
}
import React from 'react';
import ReactDOM from 'react-dom';
class Grade extends React.Component {
constructor(props) {
super(props);
this.state = {
result: 0,
num1: 0,
num2: 0
};
this.handlenum1Change = this.handlenum1Change.bind(this);
this.handlenum2Change = this.handlenum2Change.bind(this);
}
handlenum1Change (evt) {
console.log(evt.target.value);
this.setState({ num1: Number(evt.target.value) });
}
handlenum2Change(evt) {
console.log(typeof evt.target.value);
this.setState({ num2: Number(evt.target.value) });
}
addAction =(event)=> {
let x = this.state.num1 + this.state.num2
this.setState({result: x })
}
render() {
return (
<form>
<label>
Name:
<input type="number" onChange={this.handlenum1Change} />
<input type="number" onChange={this.handlenum2Change}/>
<input type="button" onClick={this.addAction} value="Add"/>
<input type='text' value={this.state.result} readOnly/>
</label>
</form>
);
}
}
export default Grade;
