Я пытаюсь расширить код, созданный AutoSponge.http://www.endusersharepoint.com/2008/12/22/jquery-for-everyone-cleaning-windows-pt2/
Вместо использования <input type="checkbox" ... />
для запуска события, я пытаюсь использовать
<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>