By GokiSoft.com| 20:09 23/02/2021|
Học JS

Xử lý sự kiện trong javascript - events in javascript - Phương trình bậc nhất trong Javascript - ax+b=0 javascript - a*x+b=0 trong javascript

Yêu cầu xây dựng trang web như sau

Khi người dùng click vào "Nhập Giá Trị A", "Nhập Giá Trị B" => Xuất hiện prompt để nhập dữ liệu tương ứng

Khi người dùng click vào In Kết Quả -> Hiển thị alert về kết quả tính toán được.

Phản hồi từ học viên

5

(Dựa trên đánh giá ngày hôm nay)

hieuvm0512 [community,C2010L]
hieuvm0512

2021-02-26 11:07:39



<!DOCTYPE html>
<html>
<head>
	<title>Xu Li Su Kien</title>
	<meta charset="utf-8">
</head>
<body>
		<h1>Giai Phuong Trinh Bac 1</h1>
	<button  onclick="Nhapa()">Nhap gia tri cua a</button>
    <button  onclick="Nhapb()">Nhap gia tri cua b</button>  
    <button  onclick="KQ(result1,result2)">Ket qua</button>
    <button input type="Reset">Reset</button>
    <script type="text/javascript">

		function Nhapa(x) {
        var x = parseInt(prompt('Nhap a='))
		console.log('a='+x)
		return x
	}
	var result1 = Nhapa()
	function Nhapb(x){
		var x = parseInt(prompt('Nhap b='))
		console.log('b='+x)
		return x
	}
	var result2 = Nhapb()
	function KQ(x,y)
		{
			if(x==0)
		{
			if(y==0)
			{
				alert('Phuong trinh vo so nghiem')
			}
			else
			{
			alert('Phuong trinh vo nghiem')	
			}
		}
		else
		{
			alert('Phuong trinh co nghiem duy nhat la' +(-y)/x)
			console.log('x= '+(-y)/x)
		}

		}

    </script>



</body>
</html>



Nguyễn Minh Hiếu [community,C2010L]
Nguyễn Minh Hiếu

2021-02-25 09:14:28



var a,b,x
function Nhap_a(){
    a = prompt('Nhap a:');
}
function Nhap_b(){
    b = prompt('Nhap b:');
}
function ketqua(){
    if(a==0){
        if(b==0){
            console.log('Phương trình vô số nghiệm');
        }
        else{
            console.log('Phương trình vô nghiệm');
        }
    }
    else{
        console.log('Phương trình có nghiệm ' + -b/a);
    }
}




Vũ Ngọc Văn [community,C2010L]
Vũ Ngọc Văn

2021-02-25 03:14:54



<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- <link rel="stylesheet" href="css/bai3-event.css">
    <script src="js/bai3-event.js"></script> -->
    <title>Bài 3 - Event - Phương trình bậc nhất</title>
    <style>
        *{
            margin: 0;
            padding: 0;
        }
        body{
            font-family: Verdana, Geneva, Tahoma, sans-serif;
        }
        .main-container{
            text-transform: capitalize;
            min-width: max-content;
            max-width: 40vw;
            margin: auto;
            margin-top: 2em;
            background-color: #337AB7;
            border: 1px solid #337AB7;
            border-radius: 5px;
            overflow: hidden;
        }

        .header{
            color: white;
            padding: 1em;
        }
            .header h2{
                font-size: inherit;
            }
        .button-container{
            background-color: white;
            padding: 1em;
        }
            .button-container button{
                padding: 0.5em;
                background-color: #5CB85C;
                color: white;
                border: none;
                text-transform: inherit;
                border-radius: 5px;
            }
            .button-container button:hover{
                background-color: #4b964b;
            }
    </style>
    <script>
        var a,b,x;

        function nhap_a(){
            a = prompt("Nhập giá trị a:");
            console.log("a = " + a)

            if (isNaN(a)){
                alert("Hãy nhập vào số!");
            }
        }

        function nhap_b(){
            b = prompt("Nhập giá trị b:");
            console.log("b = " + b)

            if (isNaN(b)){
                alert("Hãy nhập vào số!");
            }
        }

        function in_ket_qua(){
            if (a == 0){
                alert("Phương trình vô nghiệm!");
            }
            else if (b == 0) {
                alert("Phương trình có vô số nghiệm!");
            }
            else{
                x = -b/a;
                console.log(x);

                if (isNaN(x)){
                    alert("Giá trị a và b phải là số!")
                }
                else alert("Kết quả x là: " + x);
            }
        }
        function reset(){
            location.reload()
        }
    </script>
</head>
<body>
    <div class="main-container">
        <div class="header">
            <h2>Giải phương trình bậc 1</h2>
        </div>
        <div class="button-container">
            <button type="button" onclick="nhap_a()">Nhập giá trị a</button>
            <button type="button" onclick="nhap_b()">Nhập giá trị b</button>
            <button type="button" onclick="in_ket_qua()">In kết quả</button>
            <button type="button" onclick="reset()">Reset</button>
        </div>
    </div>
</body>
</html>



Đào Mạnh Dũng [community,C2010L]
Đào Mạnh Dũng

2021-02-23 16:00:43



<!DOCTYPE html>
<html>
   <head>
      <title>Giải phương trình bậc 1</title>
      <meta charset="utf-8">


 
      <script type = "text/javascript">
 
                 var a
                 var b


         function inputA(target)  {

               a = prompt('Nhập giá trị của a');
              
         }
         function inputB(target)  { 

               b = prompt('Nhập giá trị của b');

         }
         function outputkq(target)  {



             if (a == 0) {

        if (b == 0)

           { 

            alert('Phương trình có vô số nghiệm')
      }
  

  else
    { 
      alert('Phương trình có vô nghiệm')

      }

            
    }
    else

          alert('Phương trình có một nghiệm là x: ' + (-b/a) )

         }

      </script>
 
   </head>
   <body>
 
      <h3>giải phương trình a*x+b=y</h3>
 
      <button onclick="inputA(this)" style="background-color: #00FF00 ; color: #FFFFFF ">Nhập Giá Trị A</button>
      <button onclick="inputB(this)" style="background-color: #00FF00 ; color: #FFFFFF">Nhập Giá Trị B</button>
      <button onclick="outputkq(this)" style="background-color: #00FF00 ; color: #FFFFFF">in kết quả</button>
 
   </body>
</html>



Vũ Trung Kiên [C2009I]
Vũ Trung Kiên

2021-02-03 14:29:19


#1624.html


<!DOCTYPE html>
<html>
<head>
	<title>Giải phương trình bậc 1</title>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
	<link rel="stylesheet" href="https://pro.fontawesome.com/releases/v5.10.0/css/all.css">
	<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
	<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
	<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.5.2/js/bootstrap.min.js"></script>
	<style type="text/css">
		*
		{
			padding: 0;
			margin: 0;
			text-align: center;
		}
		.Main
		{
			border: solid 1px #359ee8;
			border-radius: 10px;
			margin-top: 10px;
		}
		.Top
		{
			background-color: #359ee8;
			border-top-left-radius: 8px;
			border-top-right-radius: 8px;
			padding: 5px 0;
			color: white;
		}
		.Bot
		{
			padding: 5px 0;
		}
		.ButtonFUN
		{
			padding: 15px 25px;
  			outline: none !important;
  			color: #fff;
  			background-color: #359ee8;
  			border: none;
  			border-radius: 15px;
  			box-shadow: 0 9px #999;
  			margin: 10px 0;
		}
		.ButtonFUN:hover
		{
			background-color: #2578b3 !important;
		}
		.ButtonFUN:active
		{
			background-color: #359ee8;
  			box-shadow: 0 5px #666;
  			transform: translateY(4px);
		}
		.Button
		{
			margin: 10px 0;
		}
	</style>
</head>
<body>
	<div class="container">
		<div class="Main">
			<div class="Top">
				<h4>
					Giải phương trình bậc 1
				</h4>
			</div>
			<div class="Bot">
				<div class="Text">
					<span id="A">a</span>x+<span id="B">b</span>=0 (a≠0)
					<br>
					<span id="End"></span>
				</div>
				<div class="Button">
					<button class="ButtonFUN" type="button" onclick="CheckA()">Nhập A</button>
					<button class="ButtonFUN" type="button" onclick="EnterB()">Nhập B</button>
					<button class="ButtonFUN" type="button" style="background-color: green" onclick="Done()">Giải phương trình</button>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		function CheckA () {
			do {
				a = prompt('Nhập giá trị a');
			} while (a == 0);
			document.getElementById('A').innerHTML = a;
		}
		function EnterB () {
			b = prompt('Nhập giá trị b');
			document.getElementById('B').innerHTML = b;
		}
		function Done () {
			kq = -b / a;
			document.getElementById('End').innerHTML = 'Phương trình có nghiệm:' + '<br>' + 'x = ' + kq;
		}
	</script>
</body>
</html>



silentvoice [C2009I]
silentvoice

2020-12-17 07:05:51

https://phamngoclong.herokuapp.com/baitaplab6/bai5/bai5.html


nguyen hoang viet [community,C2009I]
nguyen hoang viet

2020-12-16 17:29:05

https://nguyenhoangviet.herokuapp.com/giai_pt_bac_1.html


Vũ Trung Kiên [C2009I]
Vũ Trung Kiên

2020-12-15 16:25:20


#EventJS.html


<!DOCTYPE html>
<html>
<head>
	<title>Giải Phương Trình Bậc 1</title>
	<meta charset="utf-8">
	<style type="text/css">
		body
		{
			margin: 0px !important;
			padding: 0px !important;
		}
		.SmallBlock
		{
			width: 60%;
			margin: 0px auto;
			display: block;
			background-color: white;
		}
		.Table
		{
			border: solid 1px #0084ff;
			border-radius: 7px;
			margin-top: 100px;
		}
		.Title
		{
			background-color: #0084ff;
			color: white;
			padding-top: 10px;
			padding-left: 30px;
			padding-bottom: 10px;
			border-top-right-radius: 5px;
			border-top-left-radius: 5px;
		}
		.Control
		{
			padding-top: 15px;
			padding-bottom: 15px;
			padding-left: 25px;
		}
		button
		{
			padding-top: 10px;
			padding-bottom: 10px;
			padding-left: 10px;
			padding-right: 10px;
			background-color: #5cb85c;
			border: none;
			color: white;
			outline: none;
			cursor: pointer;
			margin-right: 10px;
			border-radius: 5px;
		}
		button:hover
		{
			background-color: #00a800;
		}
	</style>
</head>
<body>
	<div class="SmallBlock">
		<div class="Table">
			<div class="Title">
				Giải Phương Trình Bậc 1
			</div>
			<div class="Control">
				<button onclick="a()">
					Nhập Giá Trị A
				</button>
				<button onclick="b()">
					Nhập Giá Trị B
				</button>
				<button onclick="rs()">
					In Kết Quả
				</button>
			</div>
		</div>
	</div>
	<script type="text/javascript">
		function a()
		{
			alert(a = prompt('Nhập số A'));
		}
		function b()
		{
			alert(b = prompt('Nhập số B'));
		}
		function rs()
		{
			rs = (-b) / a;
			alert(rs);
		}
	</script>
</body>
</html>