时调用关闭函数吗
我有一个jQuery功能可以在点击时打开和关闭div,它运行得很好,但我想在加载时加载关闭功能。这是我的代码。。
<!DOCTYPE html>
<html><head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<title>jQuery Collapsible Demo</title>
<!-- CSS -->
<link rel="stylesheet" href="css/github.css" type="text/css">
<link rel="stylesheet" href="demo.css" type="text/css">
<!-- /CSS -->
<style>
.circle {
border-radius: 50%;
display: inline-block;
margin-right: 20px;
}
#circle2 {
width: 25px;
height: 20px;
background: #1998D7;
}
@-webkit-keyframes spin {
from { -webkit-transform: rotate(0deg); }
to { -webkit-transform: rotate(360deg); }
}
@-moz-keyframes spin {
from { -moz-transform: rotate(0deg); }
to { -moz-transform: rotate(360deg); }
}
@-ms-keyframes spin {
from { -ms-transform: rotate(0deg); }
to { -ms-transform: rotate(360deg); }
}
#advanced {
width: 20px;
height: 20px;
background-image: -moz-radial-gradient(45px 45px 45deg, circle cover, yellow 0%, orange 100%, red 95%);
background-image: -webkit-radial-gradient(45px 45px, circle cover, yellow, orange);
background-image: radial-gradient(45px 45px 45deg, circle cover, yellow 0%, orange 100%, red 95%);
/* webkit chrome, safari, mobile */
-webkit-animation-name: spin;
-webkit-animation-duration: 3s; /* 3 seconds */
-webkit-animation-iteration-count: infinite;
-webkit-animation-timing-function: linear;
/* mozilla ff */
-moz-animation-name: spin;
-moz-animation-duration: 3s; /* 3 seconds */
-moz-animation-iteration-count: infinite;
-moz-animation-timing-function: linear;
/* microsoft ie */
-ms-animation-name: spin;
-ms-animation-duration: 3s; /* 3 seconds */
-ms-animation-iteration-count: infinite;
-ms-animation-timing-function: linear;
}
</style>
</head>
<script>
function testOnLoad(){
function closeAll() {
$('.page_collapsible').collapsible('closeAll');
}
$('#closeAll').click(function(event) {
event.preventDefault();
closeAll();
});
}
</script>
<body onload="testOnLoad();">
<h1 align="center">DASHBOARD</h1>
<!-- left column collapsible -->
<!-- /left column collapsible -->
<div id="content">
<a href="#" id="closeAll" title="Close all">Open All</a> | <a href="#" id="openAll" title="Open All">Close All</a>
<!-- collapsible -->
<div align="center">
<div class="page_collapsible collapse-close" id="body-section1" >STPCODE NOT REGISTERED<span></span> <div id="circle2" class="circle">10</div></div>
<div style="display: none;" class="container" >
<div class="content">
<p>
stpcode list
</p>
</div>
</div>
<!-- end collapsible -->
<!-- collapsible -->
<div class="page_collapsible collapse-close" id="body-section1">TOTAL NUMBER OF REGISTERED USERS IN DRAFT MODE<span></span></div>
<div style="display: none;" class="container">
<div class="content">
<p>
REGISTERED USERS IN DRAFT MODE
</p>
</div>
</div>
</div>
<!-- end collapsible -->
<!-- collapsible -->
<div class="page_collapsible collapse-close" id="body-section1">TOTAL NUMBER OF REGISTERED USERS IN PAYMENT INITIATED MODE<span></span></div>
<div style="display: none;" class="container">
<div class="content">
<p>
REGISTERED USERS IN PAYMENT INITIATED MODE
</p>
</div>
</div>
<!-- collapsible -->
<div class="page_collapsible collapse-close" id="body-section1">TOTAL NUMBER OF REGISTERED USERS IN PAYMENT REJECTED MODE<span></span></div>
<div style="display: none;" class="container">
<div class="content">
<p>
REGISTERED USERS IN PAYMENT REJECTED MODE
</p>
</div>
</div>
<!-- end collapsible -->
<!-- collapsible -->
<div class="page_collapsible collapse-close" id="body-section1">TOTAL NUMBER OF REGISTERED USERS IN DISAPPROVED MODE<span></span></div>
<div style="display: none;" class="container">
<div class="content">
<p>
REGISTERED USERS IN DISAPPROVED MODE
</p>
</div>
</div>
<!-- end collapsible -->
</div>
<!-- end collapsible -->
<!-- collapsible -->
<!-- end collapsible -->
</div>
<!-- JS -->
<script type="text/javascript" src="jquery_003.js"></script>
<script type="text/javascript" src="highlight.js"></script>
<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript" src="jquery_002.js"></script>
<script type="text/javascript">
$(document).ready(function() {
//syntax highlighter
hljs.tabReplace = ' ';
hljs.initHighlightingOnLoad();
$.fn.slideFadeToggle = function(speed, easing, callback) {
return this.animate({opacity: 'toggle', height: 'toggle'}, speed, easing, callback);
};
//collapsible management
$('.collapsible').collapsible({
defaultOpen: 'section1',
cookieName: 'nav',
speed: 'slow',
animateOpen: function (elem, opts) { //replace the standard slideUp with custom function
elem.next().slideFadeToggle(opts.speed);
},
animateClose: function (elem, opts) { //replace the standard slideDown with custom function
elem.next().slideFadeToggle(opts.speed);
},
loadOpen: function (elem) { //replace the standard open state with custom function
elem.next().show();
},
loadClose: function (elem, opts) { //replace the close state with custom function
elem.next().hide();
}
});
$('.page_collapsible').collapsible({
defaultOpen: 'body_section1',
cookieName: 'body2',
speed: 'slow',
animateOpen: function (elem, opts) { //replace the standard slideUp with custom function
elem.next().slideFadeToggle(opts.speed);
},
animateClose: function (elem, opts) { //replace the standard slideDown with custom function
elem.next().slideFadeToggle(opts.speed);
},
loadOpen: function (elem) { //replace the standard open state with custom function
elem.next().show();
},
loadClose: function (elem, opts) { //replace the close state with custom function
elem.next().hide();
}
});
//assign open/close all to functions
function openAll() {
$('.page_collapsible').collapsible('openAll');
}
function closeAll() {
$('.page_collapsible').collapsible('closeAll');
}
//listen for close/open all
$('#closeAll').click(function(event) {
event.preventDefault();
closeAll();
});
$('#openAll').click(function(event) {
event.preventDefault();
openAll();
});
});
</script>
<!-- /JS -->
</body></html>
有人能帮我如何在加载
实际上。。。定义testOnload函数的脚本标记位于head标记和body标记之外。。。我认为这在html中是不允许的。因此,该脚本块可能永远不会执行。
testOnLoad()函数执行得很好。当函数被调用时,你会得到".colleble"不是一个函数。可能是因为函数是在一个.js脚本中定义的尝试在导入的.js文件下移动包含该函数的标记。
您可以使用您的函数并通过调用它,也可以使用脚本形式"Viswanath D"
我还注意到CloseAll函数有多个声明。