Question

以下HTML最初是在javascript函数中生成的，但我认为最好把它放在php中：

<div id="formcontainer">
<h1>Login</h1>
<form method="post" action="index.php">
<p><input type="text" name="login" value="" placeholder="Email"></p>
<p><input type="password" name="password" value=""placeholder="Password"></p>
<p class="submit"><input type="submit" name="commit" value="Login"></p>
</form>
</div>

原始的javascript函数仍然存在，但现在它唯一的作用是定位“formcontainer”：

function setuploginzone() {
   var head = document.getElementById("superheader");
   var foot = document.getElementById("superfooter");
   var headheight = head.clientHeight;
   var footheight = foot.clientHeight;
   var contp = document.getElementById("containerparent");
   var contptop = headheight;

   contp.style.top = contptop;

   var h = contp.clientHeight; //get height of containerparent
   var vertcenter = h/2;
   var logform = document.getElementById("formcontainer");
   var logformheight = logform.clientHeight;
   var logformtop = vertcenter - (logformheight);

   logform.style.position = "relative";
   logform.style.top = logformtop;
}

最初它是在index.php末尾调用的所有javascript中，并将html插入名为“containerparent”的div中。这一切都完全正常，当它全部在javascript但现在我已经在php中创建了“formcontainer”包括标题未显示且div未根据javascript函数定位。

有什么想法吗？

Answer 1

这可能是由于正在执行的javascript和正在加载的DOM（id：formcontainer）中的元素之间的时间。如果JS函数首先运行，那么它会将您的一个或所有高度方程计算为0，并且该函数将无法按预期工作。检查是否是这种情况的简单方法是使用console.log（）一些变量，或者使用setTimeout来表示10000或者其他东西。

编辑，抱歉，只是为了清楚变量的console.log是否返回0，表明上面指定的问题。希望这可以帮助。：）

Answer 2

我认为你的问题与CSS有关。为避免设计中出现任何奇怪的变化，请尝试使用Bootstrap css和javascript。它将为您提供所需的最佳设计。它有两种不同类型的容器：

return $http({
    method: 'GET',
    url: 'http://localhost:8081/scrape'
}).then(function(resp) {
    return resp.data
});

根据您想要的位置和设计使用每一个。它易学易用。

我希望这可以帮到你

将html移动到php后，事情发生了变化

2 个答案: