如何在windows.location.href中使用淡出

我正在尝试用jQuery制作动画。它在当前页面中有效，但当我将window.location.href与Javascript一起使用时（当x.value为true时）则不行。

这是我的 HTML：

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>Test jQuery</title>
    <link rel="stylesheet"  href="test-alert-1.css">
    <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script>  
    <script>
        function result(){
            var x = document.getElementById("name");
            if (x.value){
                window.location.href='http://www.google.com';
            }else{
                alert('This field cannot be empty');
            }
        }
    </script>
    <script>
        `$`(window).load(function() {
            `$`(".loader").fadeOut("1000");
        })      
    </script>       
</head>
<body>
    <div class="loader"> </div>
    <form action="" method="post">
        <div>
            <label for="name">Name :</label>
            <input type="text" id="name" />
        </div>
    </form>
    <input type="image" onclick="result();" src="../../image/loupe.png" class="loupe">
</body>
</html>

还有我的 CSS：

.loader {
background: url(../../image/squares2.gif) no-repeat center;
cursor: wait;
height: 100%;
left: 0px;
position: fixed;
top: 0px;
width: 100%;
z-index: 9999;}

你不能淡出一个位置.href 更改，

您可以尝试淡出并将 location.href 添加为回调

像这样的东西

function result(){
  var x = document.getElementById("name");
  if (x.value){
   $(".loader").fadeOut(1000, function(){
     window.location.href='http://www.google.com';
   });
  }else{
     alert('This field cannot be empty');
  }
}

相关内容

最新更新

热门标签：