[英]fade effect in JQUERY UI calls document ready function on fadeout
是否使用如下淡入淡出效果:jQuery UI中的$( "#specialBox" ).toggle( "fade" )
導致頁面淡出時重新加載頁面?
順便說一句,這似乎僅在單擊觸發淡出的按鈕時才發生(而不是按Enter)。
{
<div id="specialBox"> //the elements who fade
<p>Special box content ...</p>
<button onmousedown="toggleOverlay()">Close Overlay</button>
</div>
<input id = "addquery" type = "button" class = "test" value = "add query"></input> //triggering button
}
<html id= "thishtml">
<head>
<script src = "jquery-2.1.0.js"></script>
<link type = "text/css" rel = "stylesheet" href = "style.css"></link>
<script type = "text/javascript" src = "graffjavs.js"></script>
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.10.4/jquery-ui.js"></script>
</head>
<body>
<form id = "docy">
<input id = "gtr" type = "text" class = "txt"></input>
<input id = "graffbut" type = "button" class = "test" value = "test JQUERY"></input>
<div class = "out" id="output">
</div>
<div id="overlay"></div>
<!-- End Overlay -->
<!-- Start Special Centered Box -->
<div id="specialBox">
<p>Special box content ...</p>
<button onmousedown="toggleOverlay()">Close Overlay</button>
</div>
<input id = "addquery" type = "button" class = "test" value = "add query"></input>
</form>
</body>
</html>
function toggleOverlay(){
var addquery = document.getElementById('addquery');
var overlay = document.getElementById('overlay');
var specialBox = document.getElementById('specialBox');
overlay.style.opacity = .8;
if(addquery.isClicked == "1"){
addquery.isClicked = "0"
$( "#specialBox" ).effect( "fade" );
$( "#overlay" ).effect( "fade" );
//overlay.style.display = "none";
//specialBox.style.display = "none";
} else {
addquery.isClicked = "1"
$( "#specialBox" ).toggle( "fade" );
$( "#overlay" ).toggle( "fade" );
//overlay.style.display = "block";
//specialBox.style.display = "block";
}
}// triggered function causing the elements to fade
function tog()
{
document.getElementById('addquery').isClicked = "0";
$('#addquery').click(function(){toggleOverlay();});
}//function that assigns the triggered function to the button
您的按鈕是一個提交按鈕。 這是type="submit"
。 當您按它時,將提交表單。 將屬性更改為type="button"
。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.