Разное выполнение функции через button и input

113

30 марта 2021, 13:40

Подскажите что не так, при инициализации функции на input все работает, а вот через button нет, функция выполняется и сразу же "все пропадает"

        <!DOCTYPE html> 
    <html lang="en"> 
    <head> 
    	<meta charset="UTF-8"> 
    	<title>Document</title> 
    </head> 
    <body> 
    	<form> 
    		<fieldset class="list" id="list"></fieldset> 
    		<button id="btn">addStr</button> 
    		<input type="button" id="pluss" value="+">	 
    	</form> 
    	<script > 
    		 
    		function sum () { 
    			let strUser = document.createElement('div'); 
    			strUser.className = "strUser"; 
    			strUser.innerHTML =  
    			'<input type="text" id="name"><input type="number" id="power"><input type="number" id="time"><input type="number" id="intake">'; 
    			list.appendChild(strUser) 
    		} 
     
    		document.getElementById("btn").onclick = sum; 
    		document.getElementById("pluss").onclick = sum; 
     
    	</script> 
    </body> 
    </html>

Answer 1

Дефолтное певедение тега button равносильно input с типом submit. Поэтому при нажатии происходит отправка формы. Соответственно надо предотвращать такое дефолтное поведение, если нужно. А можно сделать так: