我有一个按钮,点击时调用功能showDiv()
。无法从外部js文件调用功能
功能是在外部js文件中声明的命名的script.js
功能showDiv()
当我使用外部文件的脚本不被调用。 但是通过在相同的html文件中添加脚本,我成功了。
我是一个JavaScript的初学者,所以想知道这是什么原因。
函数不能被添加到外部js文件中?我在这里丢失了什么?
这里是我的html代码:
<button type="button" class="btn btn-primary btn-lg " onclick="showDiv()" >view</button>
<br/>
<br/>
<div id="container" ng-controller="ctrl" style="display:none;">
<table ng-table="table condensed" align="center">
<thead>
<tr>
<th>RUNNO</th>
<th>CWAM</th>
<th>HWAM</th>
<th>CNAM</th>
<th>DPNAM</th>
<th>OCAM</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="value in ourArray">
<td>{{value.RUNNO}}</td>
<td>{{value.CWAM}}</td>
<td>{{value.HWAM}}</td>
<td>{{value.CNAM}}</td>
<td>{{value.DPNAM}}</td>
<td>{{value.OCAM}}</td>
</tr>
</tbody>
</div>
<script type="text/javascript" src="script.js"></script>
这里是我的script.js文件:
function showDiv() {
document.getElementById('container').style.display = "block";
}
var app=angular.module("app",[])
app.controller('ctrl', ['$scope', function($scope){
$scope.ourArray=[{"RUNNO":"1","CWAM":"7615","HWAM":"2848","CNAM":"67","DPNAM":"-99","OCAM":"78603"},
{"RUNNO":"2","CWAM":"10018","HWAM":"4150","CNAM":"94","DPNAM":"167.0 ","OCAM":"78608 "},
{"RUNNO":"3","CWAM":" 11087 ","HWAM":"4416 ","CNAM":"117","DPNAM":"61.6","OCAM":" 78612"},
{"RUNNO":"4","CWAM":"5895 ","HWAM":"1737","CNAM":"44","DPNAM":"-99","OCAM":"78556"},
{"RUNNO":"5","CWAM":"7787","HWAM":"2338","CNAM":"59","DPNAM":"129.8 ","OCAM":" 78556 "},
{"RUNNO":"6","CWAM":"9610","HWAM":"3519 ","CNAM":"83","DPNAM":" 53.4","OCAM":" 78560 "}];
}])
检查在开发人员工具(f12)的网络选项卡中查看浏览器是否能够找到您的js文件。如果您的脚本与您的html文件不在同一个目录级别,这可能是您的问题。同时检查你的控制台是否有错误 – scrappedcola