javascript - JQuery Mobile Div 在页面访问时加载

Question

我是 Jquery/Javascript 和 Jquery Mobile 的新手。我有两页，第一页和第二页。在第二页上，我隐藏了一个 div，仅在单击按钮时显示。但是，每当从第一页单击第二页的链接时，div 就会自动加载，但刷新时 div 会正常运行。

我的html

<div class="content">
    <div class="dont_show center b">Please Wait...<br /><img src="images/loading.gif" /></div>
    <div class="b">
        <div>
            <img height="10%" width="10%" src="images/logo.png" alt="" />
        </div>
        <div class="inner-addon left-addon">
            <i class="glyphicon glyphicon-user"></i>      
            <input type="email" data-clear-btn="true" class="form-control" id="email" required="required" placeholder="Email Address" />
        </div>
        <div><a href="#" onclick="forgot(); return false;" class="btn btn-primary">Reset Password</a></div>
    </div>
</div>

我的CSS

 #dont_show, .dont_show { display: none; } 

Jquery

function forgot(){
    $('.b').toggle();
    var email = $('#email').val();
    if(email == '') {
        alert('Email Is Required');
        $('.b').toggle();
        return;
    }
}

Answer 1

使用下面的代码HTML

<div class="content">
    <div class="dont_show center b">Please Wait...<br /><img src="images/loading.gif" /></div>
    <div class="b">
    <div>
        <img height="10%" width="10%" src="images/logo.png" alt="" />
    </div>
    <div class="inner-addon left-addon">
        <i class="glyphicon glyphicon-user"></i>      
        <input type="email" data-clear-btn="true" class="form-control" id="email" required="required" placeholder="Email Address" />
    </div>
    <div><a href="#" class="btn btn-primary">Reset Password</a></div>
</div>

JavaScript

$(document).ready(function(){
$('a').click(function(){
$('.b').toggle();
var email = $('#email').val();
if(email == '') {
    alert('Email Is Required');
    $('.b').toggle();
    return;
}
});
 });

CSS

#dont_show, .dont_show { display: none; }