Question

我有一个必须由用户编译的表单列表。当打开页面时，我希望已经选择了第一个表单，因此打开页面后用户不必单击它。

谢谢。

这是一个小示例，打开页面后，必须已经选择“代码”表单。

<div class="formxx">
    <div>
        <label for="txCode" id="codeLabel">Code</label>
        <input type="text" class="form-control" style="text-transform:uppercase" name="code" id="txCode"  maxlength="4"  tabindex="1" />
    </div>
    <div>
        <label for="txDescription" id="descLabel">Description</label>
        <input type="text" class="form-control" name="description" id="txDescription" tabindex="2" />
    </div>
</div>

我也在CodePen上做了一个“查看”，这里是：

https://codepen.io/user23xx/pen/jKRpEe

Answer 1

只需在输入字段中使用autofocus。示例如下

.form-control {
  height:20px
}
#txCode{
  margin-bottom: 20px;
}
#codeLabel{
  font-size: 1.2em;
  font-family: arial;
  margin-right: 15px;
  font-weight: bold;
}
#descLabel{
  font-size: 1.2em;
  font-family: arial;
  margin-right: 15px;
  font-weight: bold;
}

<div class="formxx">
            <div>
                <label for="txCode" id="codeLabel">Code</label>
                <input type="text" autofocus class="form-control" style="text-transform:uppercase" name="code" id="txCode"  maxlength="4"  tabindex="1" />
            </div>
            <div>
                <label for="txDescription" id="descLabel">Description</label>
                <input type="text" class="form-control" name="description" id="txDescription" tabindex="2"
                />
            </div>

Answer 2

我假设您是在说输入元素而不是表格？

您只需要将焦点设置为输入元素，就可以通过javascript做到这一点：

document.getElementById('txCode').focus();

打开表单列表时自动选择第一个表单

2 个答案: