javascript - html 对齐中的多个标签

Question

我有以下代码在 html 中定义四个单独的标签:

<label for="months" id="months" >Months</label>
<label for="weeks" id="weeks">Weeks</label>
<label for="fortnights" id="fortnights">Fortnights</label>
<label for="quarters" id="quarters">Quarters</label>

我定义了一个java脚本函数来在页面加载时隐藏这些标签。我有一个单独的java脚本函数，根据在不同下拉列表中选择的内容，一次仅显示一个标签。这按其应有的方式工作。

在这种情况下我的问题是标签没有显示在页面上的所需位置。它们显示在不同的地方，有没有办法让这些标签显示在页面上的同一位置而不是不同的地方？

干杯，迈克

嗨，马特，这是我的 JavaScript 函数，用于在页面加载时隐藏标签:

<script type="text/javascript">
            function hideLabels()
            {
                //alert("Entered hideLabels function");
                document.getElementById("months").style.visibility = "hidden";
                document.getElementById("weeks").style.visibility = "hidden";
                document.getElementById("fortnights").style.visibility = "hidden";
                document.getElementById("quarters").style.visibility = "hidden";
            }
        </script>

这是我的 Javascript 函数，根据页面上另一个下拉字段的值，一次仅显示一个标签:

 <script type="text/javascript">
            function FrequencyChange(value)
            {
                if (value == 1)
                {
                    document.getElementById("months").style.visibility = "visible";
                    document.getElementById("weeks").style.visibility = "hidden";
                    document.getElementById("quarters").style.visibility = "hidden";
                    document.getElementById("fortnights").style.visibility = "hidden";
                }
                if (value == 2)
                {
                    document.getElementById("weeks").style.visibility = "visible";
                    document.getElementById("months").style.visibility = "hidden";
                    document.getElementById("quarters").style.visibility = "hidden";
                    document.getElementById("fortnights").style.visibility = "hidden";
                }
                if (value == 3)
                {
                    document.getElementById("quarters").style.visibility = "visible";
                    document.getElementById("months").style.visibility = "hidden";
                    document.getElementById("weeks").style.visibility = "hidden";
                    document.getElementById("fortnights").style.visibility = "hidden";
                }
                if (value == 4)
                {
                    document.getElementById("fortnights").style.visibility = "visible";
                    document.getElementById("months").style.visibility = "hidden";
                    document.getElementById("weeks").style.visibility = "hidden";
                    document.getElementById("quarters").style.visibility = "hidden";
                }
            }

谢谢，迈克

Answer 1

您可以使用CSS:

    label{position:absolute;top:0;left:0;}