Question

好的，我知道这可以做到，因为我以前见过它。然而，我不知道如何使它工作我到处寻找答案。

我需要的是，当页面从页面上的3个不同位置加载时，我的表单会随机更改位置。所以例如......

[Here] [Here] [Here]

表格可以加载所有可能的点，但每次加载时只能加载1个点。我不知道您需要哪些信息来帮助我。我现在就给我的表格。

<form name="inputt" action="" method="post">
  <div align="center">
    <input type="submit" class="catch" value="Catch Pokemon" name="catch">
  </div>
</form>

如果您需要更多，请询问。

Answer 1

只是我的初衷，但你可以为3个不同的位置类编写CSS，并称它们为'position1'，'position2'，'position3'。然后，如果需要，在javascript（或PHP）中加载页面，生成1到3之间的随机数，将类"position"+randomNumber添加到元素中，然后它将位于其中一个位置。这类似于我用于随机背景图像的技术。

<强>更新

此外，如果您想为位置使用更多描述性的类名，您可以保持数字到类名的映射（或使用类似数组中的位置），将随机数与类相关联应用

<强>代码

CSS：

<style>
    .position1 {
        // Whatever style you want for position 1
    }
    .position2 {
        // Whatever style you want for position 2
    }
    .position3 {
        // Whatever style you want for position 3
    }
</style>

JS：

$(document).ready( function () {
    var randomIndex = Math.floor(Math.random()*3)+1; //3 is the number of options you have; +1 makes the range 1 - 3 instead of 0 - 2
    $('#my-form').addClass('position'+randomIndex); //Adds the new class the element with id = 'my-form'
}

Answer 2

如果您的意思是“加载”页面刷新，则必须在cookie或其他机制中保留表单的上一个位置。根据表格的最后位置，您可以决定下一个位置。

如果基于ajax调用重新加载表单，那么我建议使用var来存储表单的先前位置，并通过检查var的值使下一个位置与之前的位置不同。如果每次表单加载位置应该是唯一的，而不是使用数组来存储以前使用的显示位置。

HTH。

在页面加载时更改表单位置

2 个答案: