1.焦點事件focus()與blur()
focus:獲取對象焦點觸發事件;
$(function(){
$("xxx").focus(function(){
............
});
});
blur:失去對象焦點觸發事件;
$(function(){
$("xxx").blur(function(){
............
});
});
2.代碼示例
html腳本:
<body style="text-align:center;">
總完成額:<input type="text" size="8px;" id="test1">
目標完成額:<input type="text" size="8px;" id="test2">
參與考覈薪資:<input type="text" size="8px;" id="test3">
應得考覈薪資:<input type="text" size="8px;" id="test4">
</body>
js腳本:
$(function(){
//獲取焦點事件觸發
$("#test4").focus(function(){
//設置文本框背景顏色
$("#test4").css("background-color","#FFFFCC");
//獲取總完成額
var str=$("#test1").val();
//獲取目標完成額
var str1=$("#test2").val();
//獲取參與考覈薪資
var str2=$("#test3").val();
//獲取應得考覈薪資
var str3=$("#test4").val();
if(str/str1>=0.8){
str3=str2;
}
else{
str3=(str/str1)*str2;
}
$("#test4").val(str3);
});
//失去焦點觸發
$("#test4").blur(function(){
//設置文本框背景顏色
$("#test4").css("background-color","#D6D6FF");
//鼠標失去焦點時,清空文本框內容
//$("#test3").val(" ");
});
});
效果: