JQUERY UI中的淡入淡出效果会在淡出时调用文档准备功能

Question

是否使用如下淡入淡出效果：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

Answer 1

您的按钮是一个提交按钮。 这是type="submit" 。 当您按它时，将提交表单。 将属性更改为type="button" 。

JQUERY UI中的淡入淡出效果会在淡出时调用文档准备功能

问题描述

1 个解决方案

解决方案1
1 已采纳 2014-03-11 21:33:14

JQUERY UI中的淡入淡出效果会在淡出时调用文档准备功能

问题描述

1 个解决方案

解决方案1 1 已采纳 2014-03-11 21:33:14

解决方案1
1 已采纳 2014-03-11 21:33:14