jqueryボタンクリック後のカウントダウン効果を実現
7557 ワード
span style="color:rgb(128,0,0);">"-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
"http://www.w3.org/1999/xhtml">
"</span><span style="color:rgb(128,0,0);">HTML/js/jquery-1.4.1.min.js</span><span style="color:rgb(128,0,0);">"</span> type=<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">text/javascript</span><span style="color:rgb(128,0,0);">"</span>>
"</span><span style="color:rgb(128,0,0);">text/javascript</span><span style="color:rgb(128,0,0);">"</span>>
<span style="color:rgb(0,0,255);">var</span> InterValObj; <span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);">timer , </span>
<span style="color:rgb(0,0,255);">var</span> count = <span style="color:rgb(128,0,128);">5</span>; <span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);"> ,1 </span>
<span style="color:rgb(0,0,255);">var</span> curCount;<span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);"> </span>
function sendMessage() {
curCount = count;
<span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);"> button , </span>
$(<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">#btnSendCode</span><span style="color:rgb(128,0,0);">"</span>).attr(<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">disabled</span><span style="color:rgb(128,0,0);">"</span>, <span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">true</span><span style="color:rgb(128,0,0);">"</span>);
$(<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">#btnSendCode</span><span style="color:rgb(128,0,0);">"</span>).val(<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);"> </span><span style="color:rgb(128,0,0);">"</span> + curCount + <span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);"> </span><span style="color:rgb(128,0,0);">"</span>);
InterValObj = window.setInterval(SetRemainTime, <span style="color:rgb(128,0,128);">1000</span>); <span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);"> ,1
</span><span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);"> </span>
$.ajax({
type: <span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">POST</span><span style="color:rgb(128,0,0);">"</span>, <span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);"> POST </span>
dataType: <span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">text</span><span style="color:rgb(128,0,0);">"</span>, <span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);"> :JSON</span>
url: <span style="color:rgb(128,0,0);">'</span><span style="color:rgb(128,0,0);">Login.ashx</span><span style="color:rgb(128,0,0);">'</span>, <span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);"> </span>
data: <span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">dealType=</span><span style="color:rgb(128,0,0);">"</span> + dealType +<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">&uid=</span><span style="color:rgb(128,0,0);">"</span> + uid + <span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">&code=</span><span style="color:rgb(128,0,0);">"</span> + code,
error: function (XMLHttpRequest, textStatus, errorThrown) { },
success: function (msg){ }
});
}
<span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);">timer </span>
function SetRemainTime() {
<span style="color:rgb(0,0,255);">if</span> (curCount == <span style="color:rgb(128,0,128);">0</span>) {
window.clearInterval(InterValObj);<span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);"> </span>
$(<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">#btnSendCode</span><span style="color:rgb(128,0,0);">"</span>).removeAttr(<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">disabled</span><span style="color:rgb(128,0,0);">"</span>);<span style="color:rgb(0,128,0);">//</span><span style="color:rgb(0,128,0);"> </span>
$(<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">#btnSendCode</span><span style="color:rgb(128,0,0);">"</span>).val(<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);"> </span><span style="color:rgb(128,0,0);">"</span>);
}
<span style="color:rgb(0,0,255);">else</span> {
curCount--;
$(<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);">#btnSendCode</span><span style="color:rgb(128,0,0);">"</span>).val(<span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);"> </span><span style="color:rgb(128,0,0);">"</span> + curCount + <span style="color:rgb(128,0,0);">"</span><span style="color:rgb(128,0,0);"> </span><span style="color:rgb(128,0,0);">"</span>);
}
}
"btnSendCode" type="button" value=" " οnclick="sendMessage()" />