By GokiSoft.com|
20:03 23/03/2021|
Học JQuery
Bài tập - Sử dụng bootstrap + jquery - Xử lý event - Lập trình Bootstrap/jQuery
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.
Tags:
Phản hồi từ học viên
5
(Dựa trên đánh giá ngày hôm nay)
![Trần Thị Khánh Huyền [T2008A]](https://www.gravatar.com/avatar/554e115833778e4294a01aebe228f3d6.jpg?s=80&d=mm&r=g){kind=avatar}
Trần Thị Khánh Huyền
2020-11-03 03:31:41
#2060.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.0">
<style>
.main{
border: 1px solid blue;
border-radius: 5px;
width: 100%;
height:80px;
display: block;
}
.top{
background-color: blue;
height: 30px;
padding-left: 5px;
padding-top: 5px;
color: white;
}
ul{
display: flex;
list-style-type: none;
}
li{
border: 1px solid #7ab369;
background-color: #7ab369;
border-radius: 5px;
padding: 5px;
margin-right: 10px;
margin-top: -7px;
color: white;
cursor: pointer;
}
</style>
</head>
<body>
<div class="main">
<div class ="top">
Giải Phương Trình Bậc 1
</div>
<div>
<ul>
<li id="InputA">Nhập giá trị A</li>
<li id="InputB">Nhập giá trị B</li>
<li id="Result">In Kết Quả</li>
</ul>
</div>
</div>
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<script type="text/javascript">
var A, B, x;
$('#InputA').click(function(){
A=prompt("Nhập giá trị A:")
})
$('#InputB').click(function(){
B=prompt("Nhập giá trị B:")
})
$('#Result').click(function(){
if (A==0) {
if (B==0) {alert('PTVSN')}
else(alert('PTVN'));
}else{
C=-B/A;
alert('Phương trình có nghiệm: '+C)}
})
</script>
</body>
</html>![Nguyên Phấn Đông [T2008A]](https://www.gravatar.com/avatar/c9c4f8f79ce35b9224637b6cc5fbe5c4.jpg?s=80&d=mm&r=g){kind=avatar}
Nguyên Phấn Đông
2020-11-02 12:02:53
#test.html
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<meta name='viewport' content='width=device-width, initial-scale=1'>
<script src='https://kit.fontawesome.com/a076d05399.js'></script>
<style type="text/css">
.navbar-nav .nav-item a:hover{
background: yellow;
border: 9px !important;
}
.float-left{
background-color: black !important;
}
.khung{
border: 1px solid #d9d9d4 !important;
background-color: #dbd5d5 !important;
}
.card1{
background-color: #dbd5d5 !important;
}
</style>
</head>
<body>
<nav class="navbar navbar-expand-sm bg-dark" style="color: white;">
<ul class="navbar-nav">
<li class="nav-item" style="margin-left: 50px; margin-top: 4px;">Hàng thật - giá chuẩn - Phục vụ tận tâm</li>
<li class="nav-item" style="margin-left: 200px; margin-top: 4px;">
<i class="fas fa-phone-alt" style="color: yellow"></i>
Hotline: 0974 576 809 . 0911 545 121 . 0987 425 657
</li>
<li class="nav-item" style="margin-left: 100px;">
<form class="form-inline" action="/action_page.php">
<input class="form-control mr-sm-2" type="text" placeholder="Search">
<button class="btn btn-success" type="submit" style="color: yellow;"><i class="fas fa-search" ></i></button>
</form>
</li>
</ul>
</nav>
<nav class="navbar navbar-expand-sm">
<a class="navbar-brand" href="#" style="margin-left: 104px; padding-right: 20px;">
<img src="https://donghosomot.com/Styles/images/logo-header.png" alt="logo">
</a>
<ul class="navbar-nav" style="margin-left: 248px;"><i class="fas fa-home" style="color: yellow;padding-bottom: 2px;padding-top: 10px;padding-right: 6px;"></i>
<li class="nav-item">
<a href="#" class="nav-link" style="color: black;color: black;padding-bottom: 20px;padding-top: 20px;">ĐỒNG HỒ NAM</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link" style="color: black;color: black;padding-bottom: 20px;padding-top: 20px;">ĐỒNG HỒ NỮ</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link" style="color: black;color: black;padding-bottom: 20px;padding-top: 20px;">ĐỒNG HỒ ĐÔI</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link" style="color: black;color: black;padding-bottom: 20px;padding-top: 20px;">MẪU HOT NHẤT</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link" style="color: black;color: black;padding-bottom: 20px;padding-top: 20px;">SALE</a>
</li>
<li class="nav-item">
<a href="#" class="nav-link" style="color: black;color: black;padding-bottom: 20px;padding-top: 20px;">BLOG</a>
</li>
</ul>
</nav>
<img src="https://donghosomot.com/FileUpload/Images/banner_hourglass_xpx.png" class="mx-auto d-block">
<div class="container" style="margin-top: 20px;">
<div class="float-left card bg-dark">
<div class="card-header text-white">
DANH MỤC SẢN PHẨM
</div>
<div class="card-body text-white">
<ul>
<li>
<a href="#" class="nav-link" style="color: white;">Edox</a>
</li>
<li>
<a href="#" class="nav-link" style="color: white;">Michael Kors</a>
</li>
<li>
<a href="#" class="nav-link" style="color: white;">Mare by Mare Jacobs</a>
</li>
<li>
<a href="#" class="nav-link" style="color: white;">Burberry</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Bulova</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Bulova Accutron</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Calvin Klein</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">DKNY</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Frederique Constant</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Gucci</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Hamilton</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Longines</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Maurice Lacroix</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Montblanc</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Movado</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Omega</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Oris</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Rado</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Raymond Weil</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Skagen</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Swarovski</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">TAG Heuer</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Tissot</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Victorinox Swiss Army</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Lacoste</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Zenith</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Charmex</a>
</li>
<li>
<a href="" class="nav-link" style="color: white;">Seico</a>
</li>
</ul>
</div>
</div>
<div class="card-body bg-light khung">
<div class="container-fluid">
<div class="row">
<div class="col card1 card">
<a href="#" class="nav-link">
<img src="https://donghosomot.com/FileUpload/Images/thumb/sl_10.jpg">
</a>
<p>Đồng hồ nam Calvin Klein Infinite K5S346G6</p>
<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
</div>
<div class="col card1 card">
<a href="#" class="nav-link">
<img src="https://donghosomot.com/FileUpload/Images/thumb/dongholomayseikossakchonamcdd_result.png">
</a>
<p>Đồng hồ nam Frederique Constant Slimline FC-235M4S4</p>
<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
</div>
<div class="col card1 card">
<a href="#" class="nav-link">
<img src="https://donghosomot.com/FileUpload/Images/thumb/sl_result_3.png">
</a>
<p>Đồng hồ nam Orient Sun And Moon RA-AK0304B10B</p>
<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
</div>
</div>
</div>
<div class="container-fluid" style="margin-top: 30px;">
<div class="row">
<div class="col card1 card">
<a href="#" class="nav-link">
<img src="https://donghosomot.com/FileUpload/Images/thumb/dong_ho_orient_raakbb_result.jpg">
</a>
<p>Đồng hồ nam Orient Sun And Moon RA-AK0303L10B</p>
<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
</div>
<div class="col card1 card">
<a href="#" class="nav-link">
<img src="https://donghosomot.com/FileUpload/Images/thumb/raaklb_result.jpg">
</a>
<p>Đồng hồ nữ Orient RA-KA0006S00B</p>
<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
</div>
<div class="col card1 card">
<a href="#" class="nav-link">
<img src="https://donghosomot.com/FileUpload/Images/thumb/efeeeadecaaad_result.jpg">
</a>
<p>Đồng hồ nữ Versace Mini Vanity VEAA00218</p>
<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
</div>
</div>
</div>
<div class="container-fluid padding" style="margin-top: 30px;">
<div class="row padding">
<div class="col-md-4 card1 card">
<a href="#" class="nav-link">
<img src="https://donghosomot.com/FileUpload/Images/thumb/sl_result_61.jpg">
</a>
<p class="card-text">Đồng hồ nữ Versace V-Circle VE8100118</p>
<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
</div>
<div class="col-md-4 card1 card">
<a href="#" class="nav-link">
<img src="https://donghosomot.com/FileUpload/Images/thumb/sl_result_60.jpg">
</a>
<p>Đồng hồ nam Girard Perregaux Vintage 1945 25850-0-52-1051</p>
<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
</div>
<div class="col-md-4 card1 card">
<a href="#" class="nav-link">
<img src="https://donghosomot.com/FileUpload/Images/thumb/sl__result_232.jpg">
</a>
<p>Đồng hồ nữ Versace Greca Icon VELU00619</p>
<button style="width: 200px; margin-left: 20px; background-color: black;"><a href="#" class="nav-link" style="color: white; padding-left: -20px;">Giá: Liên hệ <i class="fas fa-phone-volume"></i></a></button>
</div>
</div>
</div>
</div>
</div>
<div class="container-fluid padding">
<div class="row text-center padding">
<div class="col-12">
<img src="https://donghosomot.com/Styles/images/logo-header.png" alt="logo">
<a href="#"><i class="fas fa-facebook"></i> </a>
<a href="#"><i class="fas fa-twitter"></i> </a>
</div>
</div>
</div>
</body>
</html>![Triệu Văn Lăng [T2008A]](https://www.gravatar.com/avatar/1348e3562c6492c26f796cb1f45982a1.jpg?s=80&d=mm&r=g){kind=avatar}
Triệu Văn Lăng
2020-11-02 10:09:19
#bai2060.html
<!DOCTYPE html>
<html>
<head>
<title>tinh</title>
<meta charset="utf-8">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<style type="text/css">
button {
background-color: green;
color: white;
border-radius: 15px;
}
</style>
</head>
<body>
<div class="container border-primary" style="margin-top: 20px;">
<div class="card-header bg-primary text-white">
Giải Phương Trình Bậc I
</div>
<div class="card-body">
<button id="input1">Nhập giá trị a</button>
<button id="input2">Nhập giá trị b</button>
<button id="show">In kết quả</button>
</div>
</div>
<script type="text/javascript">
$(function(){
$('#input1').click(function() {
a=prompt('nhập giá trị a')
a=parseInt(a)
})
$('#input2').click(function(){
b=prompt('nhập giá trị b')
b=parseInt(b)
})
$('#show').click(function(){
s=a+b;
alert("tổng là "+s)
})
})
</script>
</body>
</html>![Trần Văn Lâm [T2008A]](https://www.gravatar.com/avatar/cfc15c8cb7781ad669b013e01f9f1a6b.jpg?s=80&d=mm&r=g){kind=avatar}
Trần Văn Lâm
2020-11-02 10:08:42
#bai1.html
<!DOCTYPE html>
<html>
<head>
<title>Phuong Trinh Bac 1</title>
<meta charset="utf-8">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
</head>
<body>
<div class="card">
<div class="card-header bg-primary" style="color: white;">
Giải Phương Trình Bậc 1
</div>
</div>
<div style="margin-top: 10px; margin-left: 20px;">
<button type="button" class="btn bg-success" onclick="NhapA()" id="cr7">Nhập Giá Trị A</button>
<button type="button" class="btn bg-success" onclick="NhapB()" id="m10">Nhập Giá Trị B</button>
<button type="button" class="btn bg-success" onclick="Result()" id="l8">In Kết Quả</button>
</div>
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<script type="text/javascript">
var A;
function NhapA(){
A = prompt('Nhập A')
}
var B;
function NhapB(){
B = prompt('Nhập B')
}
function Result(){
if (A==0) {
if (B==0) {
alert('PTVSN')
}else{
alert('PTVN')
}
}else{
X=-B/A
alert(X)
}
}
$(function(){
$('button').css('color', 'white')
})
</script>
</body>
</html>![nguyễn Sử [T2008A]](https://www.gravatar.com/avatar/47487be2776ac2ec915b0936ef7ab5ae.jpg?s=80&d=mm&r=g){kind=avatar}
nguyễn Sử
2020-11-02 10:02:36
#JQuerybaitap1.html
<!DOCTYPE html>
<html>
<head>
<title>Bài tập 1</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" integrity="sha384-lZN37f5QGtY3VHgisS14W3ExzMWZxybE1SJSEsQp9S+oqd12jhcu+A56Ebc1zFSJ" crossorigin="anonymous">
<!-- https://fontawesome.com/icons?from=io -->
</head>
<body>
<div class="container">
<table class="table table-bordered">
<tbody>
<thead>
<tr class="table-primary">
<th colspan="3"> Giải Phương Trình Bậc 1 </th>
</tr>
<form>
<th><button id="gta" type="button" class="btn btn-Giá Trị a" style="background-color: #30f036"> Giá Trị A </button></th>
<th><button id="gtb" type="button" class="btn btn-Giá Trị b" style="background-color:#30f036 "> Giá Trị B </button></th>
<th><button id="kq" type="button" class="btn btn-Kết Quả" style="background-color:#30f036;"> Kết Quả </button></th>
</form>
</thead>
</tbody>
</table>
</div>
<script type="text/javascript">
var a;
$('#gta').click(function(){
a=prompt("nhập số A")
})
var b;
$('#gtb').click(function(){
a=prompt("nhập số B")
})
var kq;
$('#kq').click(function(){
var kq = a + b;
alert("ket qua = "+ kq)
})
</script>
</body>
</html>![Bùi Văn Mạnh [T2008A]](https://www.gravatar.com/avatar/17e9c94870c94e61c9203ee31dccf01c.jpg?s=80&d=mm&r=g){kind=avatar}
Bùi Văn Mạnh
2020-11-02 09:55:12
#bai1.html
<!DOCTYPE html>
<html lang="en">
<head>
<title>Phuong trinh bac 1</title>
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
</head>
<body>
<div class="card">
<div class="card-header bg-primary text-white">Giải Phương Trình Bậc 1</div>
<div class="card-body">
<button type="button" class="btn btn-success" id="nhap_a">Nhập Giá Trị A</button>
<button type="button" class="btn btn-success" id="nhap_b">Nhập Giá Trị B</button>
<button type="button" class="btn btn-success" id="ketqua">In Ra Kết Quả</button>
</div>
</div>
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<script type="text/javascript">
var a, b, c;
$("#nhap_a").click(function() {
a = prompt("input a: ")
})
$("#nhap_b").click(function() {
b = prompt("input b: ")
})
$("#ketqua").click(function() {
c = b / a;
alert("Kết Quả: " + c)
})
</script>
</body>
</html>![Đức Sơn [T2008A]](https://www.gravatar.com/avatar/d2b971b7bc54e4a9689c3e2240f27949.jpg?s=80&d=mm&r=g){kind=avatar}
Đức Sơn
2020-11-02 09:42:31
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
h3{
background-color: #3580a6;
}
#N{
background-color: #78cf90;
}
#M{
background-color: #78cf90;
}
#V{
background-color:#78cf90 ;
}
</style>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.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.4.1/js/bootstrap.min.js"></script>
</head>
<body>
<h3>Giải phương trình bậc 1</h3>
<button onclick="click_1()" class="btn btn-outline-dark" id="N">Nhập giá trị A</button>
<button onclick="click_2()" class="btn btn-outline-dark" id="M">Nhập giá trị B</button>
<button onclick="click_3()" class="btn btn-outline-dark" id="V">In kết quả</button>
<script type="text/javascript">
var a,b
function click_1(){
a=prompt('Nhập giá trị a')
}
function click_2(){
b=prompt('Nhập giá trị b')
}
function click_3(){
hieu= a-b;
alert("Ket qua a va b la:"+ hieu)
}
</script>
</body>
</html>![vuong huu phu [T2008A]](https://www.gravatar.com/avatar/307a5cf29780afab49706dc8b15b86c6.jpg?s=80&d=mm&r=g){kind=avatar}
vuong huu phu
2020-11-02 09:42:10
<!DOCTYPE html>
<html>
<head>
<title></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">
<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">
</style>
</head>
<body>
<div class="container">
<table class="table table-bordered">
<thead>
<tr class="table-primary">
<th colspan="3">Giải phương trình bậc 1</th>
</tr>
</thead>
<tbody>
<tr><form>
<td><button id="nhapa" type="button" class="btn btn-success">Nhập Giá Trị A</button>
<button id="nhapb" type="button" class="btn btn-success">Nhập Giá Trị B</button>
<button id="ketqua" type="button" class="btn btn-success"> In Kết Quả</button></td>
</form></tr>
</tbody>
</table>
</div>
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<script type="text/javascript">
var a,b;
$('#nhapa').click(function() {
a = prompt("nhap so a")
})
$('#nhapb').click(function() {
b = prompt("nhap so b")
})
$('#ketqua').click(function() {
var x=eval(a)
var y=eval(b)
var t = y + x;
alert("ket qua = "+ t)
})
</script>
</body>
</html>![Đỗ Minh Quân [T2008A]](https://www.gravatar.com/avatar/fa40264d7c4b4209c87a9e9451d2b9f0.jpg?s=80&d=mm&r=g){kind=avatar}
Đỗ Minh Quân
2020-11-02 09:37:36
#BT1.html
<!DOCTYPE html>
<html>
<head>
<title>Bai 1 | JQuery - Bootstrap</title>
<meta charset="utf-8">
<!-- Latest compiled and minified CSS -->
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css">
<!-- jQuery library -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<!-- Popper JS -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.16.0/umd/popper.min.js"></script>
<!-- Latest compiled JavaScript -->
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.4.1/js/bootstrap.min.js"></script>
<!-- FontAwesome -->
<script src="https://kit.fontawesome.com/18bc5ffef0.js" crossorigin="anonymous"></script>
</head>
<body>
<div class="container mt-5">
<div class="card">
<div class="card-header bg-dark text-white">
Giải phương trình bậc 1
</div>
<div class="card-body">
<div class="row">
<button class="btn btn-success m-2" id='nhap_a'>Nhập Giá Trị A</button>
<button class="btn btn-success m-2" id='nhap_b'>Nhập Giá Trị B</button>
<button class="btn btn-success m-2" id='output'>In Kết Quả</button>
</div>
</div>
</div>
<div class="alert alert-success">
<strong>Warning!!!</strong> Hãy điền đúng số nhé !
</div>
<script>
var a, b, c;
$("#nhap_a").click(function() {
a = prompt("input a: ")
})
$("#nhap_b").click(function() {
b = prompt("input b: ")
})
$("#output").click(function() {
c = b / a;
alert("Kết Quả: " + c)
})
</script>
</body>
</html>![An Văn Minh [T2008A]](https://www.gravatar.com/avatar/e0f14efe4b11f7d9d5901e8802319c92.jpg?s=80&d=mm&r=g){kind=avatar}
An Văn Minh
2020-11-02 09:35:07
<!DOCTYPE html>
<html>
<head>
<title>Baitap1</title>
<link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.css">
<style type="text/css">
.card-header{
background-color: #491ef7;
}
.card-body{
float: left;
}
</style>
</head>
<body>
<div class="card">
<div class="card-header">Giai phuong trinh bac 1</div>
<div class="card-body">
<a name="" class="btn btn-success" id="inputA" href="#" role="button">Nhap A</a>
<a name="" class="btn btn-success" id="inputB" href="#" role="button">Nhap B</a>
<a name="" class="btn btn-success" id="Result" href="#" role="button">Ket Qua</a>
</div>
</div>
<script src="https://code.jquery.com/jquery-3.2.1.slim.min.js" integrity="sha384-KJ3o2DKtIkvYIK3UENzmM7KCkRr/rE9/Qpg6aAZGJwFDMVNA/GpGFF93hXpG5KkN" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.12.9/umd/popper.min.js" integrity="sha384-ApNbgh9B+Y1QKtv3Rn7W3mgPxhU9K/ScQsAP7hUibX39j7fakFPskvXusvfa0b4Q" crossorigin="anonymous"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/js/bootstrap.min.js" integrity="sha384-JZR6Spejh4U02d8jOt6vLEHfe/JQGiRRSQQxSfFWpi1MquVdAyjUar5+76PVCmYl" crossorigin="anonymous"></script>
<script type="text/javascript">
var count=0
$('#inputA').click(function(){
a=prompt('Nhap A')
count++
});
$('#inputB').click(function(){
b=prompt('Nhap B')
count++
});
$('#Result').click(function(){
if(count==2){
if(a==0){
if (b==0) {
alert('PTVSN')
}else {alert('PTVN')}
}else{
x=-b/a
alert('PT co nghiem la'+x)
}
}else{
alert('Ban can nhap du lieu!!')
}
});
</script>
</body>
</html>
