i_m*_*ine 3 html javascript jquery
在使它onload在身体中看不见之后,我似乎无法使div出现.这应该很容易修复,我似乎无法弄明白.
PHP
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<?php include '/include/init.php'; ?>
<script type="text/javascript" src="/js/jqeury.js"> </script>
<script type="text/javascript" src="/js/accounts.js"> </script>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="/css/style.css" />
<title>Accounts</title>
</head>
<body onload="hide_buttons()">
<div class="accounts_headerDiv">
<div class="ahd_left">
<img src="/images/launcher2.png" class="accounts_logo"/>
<p class="title_para"> Accounts </p>
</div>
<div class="ahd_right">
<div class="searchDiv">
<p class="searchPara"> Search </p>
<input type="text" id="search_input" placeholder="search" class="search_input"/>
<img src="/images/search_icon.png" class="search_icon"/>
</div>
<div class="userDiv">
<a href="#"><img src="/images/default-portrait-icon.jpg" align="right" class="user_picture" /> </a>
<p class="userInfo"><?php username($db);?></p>
<a href="/functions/logout.php"> Log out </a>
</div>
<div class="adminUserButtonsDiv" id="aubd">
<input id="createUser" name="createUser" value="Create" type="button" class="admin_button">
<br />
<input id="editUser" name="editUser" value="Edit" type="button" class="admin_button">
</div>
</div>
</div>
<hr />
<?php if (is_admin($db) === 'true') { ?>
<script type="text/javascript" src="/js/admin.js"> </script>
<?php } ?>
</body>
</html>
Run Code Online (Sandbox Code Playgroud)
该hide_buttons()函数在accounts.js中
function hide_buttons() {
$('#aubd').hide();
}
Run Code Online (Sandbox Code Playgroud)
然后当我调用admin.js来保存这个函数时,我想重新出现div
$(document).ready(function() {
$('#aubd').show();
});
Run Code Online (Sandbox Code Playgroud)
这里的总体目标是检查用户是否具有"admin"角色,并根据此检查隐藏或显示其中包含的div和按钮.那么我做错了什么?这也是正确的方法,还是应该AJAX用于此?
该onload事件发生非常在页面加载周期的后期.jQuery的ready回调发生得更早(通常).所以发生的事情是你的show电话在你hide打电话之前发生了.
最好的解决方法是不使用onload.相反,只输出隐藏的div:
<div id="aubd" style="display: none">....
Run Code Online (Sandbox Code Playgroud)
或者在你的CSS中:
#aubd {
display: none;
}
Run Code Online (Sandbox Code Playgroud)
然后你的ready处理程序会很好地显示它.
如果您无法更改onload,则可以更改admin.js以便show稍后调用:
$(window).load(function() {
setTimeout(function() {
$('#aubd').show();
}, 0);
});
Run Code Online (Sandbox Code Playgroud)
在setTimeout与非常,非常短的超时值是否有避免与竞争条件load的事件处理程序.(jQuery通过addEventListener/ 挂钩处理程序attachEvent.有些浏览器onload首先触发处理程序,然后是addEventListener/ attachEvent处理程序.其他人则以相反的方式处理它.)但同样,最好通过首先隐藏div来完全避免这种情况.
| 归档时间: |
|
| 查看次数: |
2660 次 |
| 最近记录: |