我试图通过AutoSponge
而不是使用<input type="checkbox" ... />
触发事件的撰写http://www.endusersharepoint.com/2008/12/22/jquery-for-everyone-cleaning-windows-pt2/SharePoint 2007的坍缩区域功能
代码扩大,我想使用
<input type="image" class="toggleClass" id="LeftRight"
value="tr:lt(9)" src="../../img/topcollapse.jpg" />
和
<input type="image" class="toggleClass" id="UpDown"
value="#TitleAreaImageCell, #LeftNavigationAreaCell"
src="../../img/leftcollapse.jpg" />
来触发该功能。崩溃函数有效,但img源不会更改。我认为我没有正确地调用它,但我一直无法弄清楚为什么。提前感谢您的帮助。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title></title>
<script type="text/javascript">
//initialize checkboxes
$(function() {
$("input.toggleClass:image").each(function (i, e) {
var v = e.value;
var g = GetCookie(v); //SP function
var src = ($("#UpDown").attr("src") === "img/up_arrow.bmp")
if (g == "1") {
e.checked = true;
$(v).hide();
}
});
});
//set cookie on click and hide element
$(function() {
$("input.toggleClass:image").click(function (e) {
var v = $(e.target).val();
var g = GetCookie(v);
if (g == "1") {
$(v).show();
SetCookie(v, "", "/"); //SP function
} else {
$(v).hide();
SetCookie(v, "1", "/");
}
});
});
$(document).ready(function() {
$("#UpDown").bind("click", function() {
var src = ($("#UpDown").attr("src") === "../../img/topcollapse.jpg")
? "../../img/downcollapse.jpg"
: "../../img/topcollapse.jpg";
$("#UpDown").attr("src", src);
});
});
$(document).ready(function() {
$("#LeftRight").bind("click", function() {
var src = ($("#LeftRight").attr("src") === "../../img/leftcollapse.jpg")
? "../../img/rightcollapse.jpg"
: "../../img/leftcollapse.jpg";
$("#LeftRight").attr("src", src);
});
});
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<input type="image" class="toggleClass" id="UpDown" value="#TitleAreaImageCell, #LeftNavigationAreaCell" src="img/leftcollapse.jpg" /><br /><br />
<input type="image" class="toggleClass" id="LeftRight" value="tr:lt(9)" src="img/topcollapse.jpg" />
</div>
</form>
</body>
</html>
出于测试的目的,我除去toggleClass功能和离开#LeftRight和#UpDown功能。它在短时间内工作,但页面会刷新并恢复。是否.blind(“点击”)这样做? – Austin 2011-05-23 18:07:16
我已经测试了input.toggleClass:图像,它的工作原理。 #UpDown和#LeftRight在瞬间工作,导致屏幕在恢复之前闪烁(在FireFox中测试)。我会在这里留下笔记以协助任何决定提供帮助的人。谢谢。 – Austin 2011-05-24 16:44:53