今天第一次写接口，里面打算点击按钮弹出一个进度条的gif，结果每次都需要点击两次才能显示，虽然是一个非常简单的问题，但还是记录一下比较好
先上代码（以下是错误的）
<body>
<div id="process" class="demo" style="display:none;">
<img src="../static/images/progress.gif" alt="无" />
</div>
<div id="main">
{#<input type="file" id="getfile" value="请选择">#}
<button id="abc" onclick="gt()" >进度条测试</button>
<script>
function gt() {
$('#abc').on('click',function(){
//打开进度条
// alert("XXX");
$("#process").css("display","");
$("#main").css("opacity","0.3");
});
}
</script>
</div>
</body>
错误是不是简单明了就能看出来：第一次点击按钮激活gt函数，第二次点击按钮才能成功调用，把进度条显示出来。
修改如下：
<body>
<div id="process" class="demo" style="display:none;">
<img src="../static/images/progress.gif" alt="无" />
</div>
<div id="main">
{#<input type="file" id="getfile" value="请选择">#}
<button id="abc" onclick="gt()" >进度条测试</button>
<script>
$(document).ready(function gt() {
$('#abc').on('click',function(){
//打开进度条
$("#process").css("display","");
$("#main").css("opacity","0.3");
});})
</script>
</div>
</body>
使用 $(document).ready（）将其中的函数激活，这样就可以直接使用了
![[转]Getting started with ASP.NET Web API OData in 3 simple steps](/images/no-images.jpg)
