JQ用法的if用法

求教,建立一个submit,以及100X100的DIV如何用JQ实现按下submit,如果DIV背景色为red时{DIV的背景色为blue}否则{DIV的背景色为reb}

$("#submitId").click(function(){
var divColor=$("#divId").css("background-color");
 if(divColor=="red"){
     $("#divId").css("background-color","blue");
 }else{
     $("#divId").css("background-color","red");
 }
});

追问

求教,为何只执行一次,按下按钮后,颜色变了,但是第二次点击,却没反应
为什么前面不加$(document).ready(function()就没有效果了喔?

追答

$(document).ready(function());这句的意思的页面加载完成后执行 当你的页面没有被加载完成时,页面元素或者页面元素样式是不完全的 执行上面的语句就没效果了 。只执行一次应该是执行完成后表单提交 页面进行了刷新 。可以在click方法末尾加上 return false;阻止提交

温馨提示:答案为网友推荐,仅供参考
第1个回答  2015-08-01
JQ用法的if用法:
<!DOCTYPE html>
<html>
<head>
<script src="Scripts/jquery-1.6.2.min.js" type="text/javascript"></script>
<script src="Scripts/tmpl.js" type="text/javascript"></script>
</head>
<body>
<script id="DeptTemplate" type="text/x-jquery-tmpl">
Title:${Name}
{{if Emp.length}}
成员:${$item.getEmp("-")}
{{/if}}
<br />
Title:${Name}
{{if Emp.length==2}}
成员:${$item.getEmp("-")}
{{/if}}
<br />
</script>
<div id="DeptList">
</div>
<script>
var deptlist = [
{ Name: "销售部", Emp: ["张三", "李四"] },
{ Name: "软件部", Emp: [] },
{ Name: "网络部", Emp: ["王二麻子", "王小"] }
];
$("#DeptTemplate").tmpl(deptlist,
{
getEmp: function (separator) {
return this.data.Emp.join(separator);
}
}).appendTo("#DeptList");
</script>
</body>
</html>
--输出结果