<!doctype html>
<html lang="en">
<head>
<!-- Required meta tags -->
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
<title>Hello, Bootstrap Table!</title>
<link href="~/lib/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet" />
<link href="https://cdn.bootcdn.net/ajax/libs/font-awesome/5.13.1/css/all.min.css" rel="stylesheet">
<link href="~/bootstraptable/bootstrap-table.min.css" rel="stylesheet" />
</head>
<body>
<button type="button" class="btnStart btn btn-primary" >开始</button>
<button type="button" class="btnStop btn btn-warning" >停止</button>
<p class="test">
</p>
<table data-toggle="table">
<thead>
<tr>
<th>Item ID</th>
<th>Item Name</th>
<th>Item Price</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>Item 1</td>
<td>$1</td>
</tr>
<tr>
<td>2</td>
<td>Item 2</td>
<td>$2</td>
</tr>
</tbody>
</table>
<script src="~/lib/jquery/dist/jquery.min.js"></script>
<script src="~/lib/bootstrap/dist/js/bootstrap.bundle.min.js"></script>
<script src="~/bootstraptable/bootstrap-table.min.js"></script>
<script>
var i = 0;
var t1 = null;
$('.btnStart').click(function () {
if (t1 == null) {
t1 = window.setInterval(hello, 1000);
$(this).attr('disabled', true);
$('.btnStop').attr('disabled', false);
}
});
$('.btnStop').click(function () {
window.clearInterval(t1);
$('.btnStart').attr('disabled', false);
$(this).attr('disabled', true);
t1 = null;
})
function hello() {
i++;
$('.test').text(i);
}
</script>
</body>
</html>
javascript setInterval开启,停止
最新推荐文章于 2023-06-03 09:30:00 发布