<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="jquery-1.11.1.min.js"></script>
<script type="text/javascript" src="bootstrap-3.3.4-dist/js/bootstrap.min.js"></script>
<link rel="stylesheet" type="text/css" href="bootstrap-3.3.4-dist/css/bootstrap.min.css">
</head>
<body>
<h2>my test modal in bootstarp</h2>
<a href="javascript:myModalTest()">myModal</a>
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true" style="display: none;" data-backdrop="static">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" οnclick="" data-dismiss="modal"><span aria-hidden="true">×</span></button>
<h4 class="modal-title" id="myModalLabel">開課信息</h4>
</div>
<div class="modal-body" id="modal-body">
<div class="row">
<div class="form-horizontal" method="post" style="margin-left: 50px">
<div class="box-body table-responsive">
<table id="courseLst" class="table dataTable table-bordered table-hover ellipsisTb">
<tbody>
<tr index="4" style="">
<td>結束時間</td>
<td title="03/24/2015 09:56" class="text-center">03/24/2015 09:56</td>
</tr>
<tr index="4" style="">
<td>狀態</td>
<td title="可申請" class="text-center">可申請</td>
</tr>
</tbody>
</table>
</div>
</div>
</div>
</div>
<div class="modal-footer">
</div>
</div>
</div>
</div>
</body>
<script type="text/javascript">
$(document).ready(function() {
console.log('fool');
});
function myModalTest() {
console.log("test");
$("#myModal").modal();
}
</script>
</html>