我有一个网站,我想使用js在页面加载时将焦点设置为输入字段。我无法更改以下代码。这是输入标签:
input class="form-control ng-pristine ng-valid ng-scope ng-touched"
ng-model="query.q" type="text"
placeholder="Enter search terms - use quotes for phrases"
kw-clearable-input=""
我在下面试过js看其他类似的主题,但没有运气:
function setFocusToTextBox(){
document.getElementsByClassName("form-control ng-pristine ng-valid ng-scope ng-touched")[0]; element.focus();
}
任何帮助将非常感激。谢谢。
问题是焦点函数中没有定义元素。
正确定义时,它正在工作。
function setFocusToTextBox()
{
let element = document
.getElementsByClassName("form-control ng-pristine ng-valid ng-scope ng-touched")[0];
element.focus();
}
setFocusToTextBox();
<input class="form-control ng-pristine ng-valid ng-scope ng-touched" ng-model="query.q" type="text" placeholder="Enter search terms - use quotes for phrases" kw-clearable-input=""/>
您还可以删除元素并使用焦点加入查询,如下所示:
function setFocusToTextBox()
{
document.getElementsByClassName("form-control ng-pristine ng-valid ng-scope ng-touched")[0].focus();
}
setFocusToTextBox();
<input class="form-control ng-pristine ng-valid ng-scope ng-touched" ng-model="query.q" type="text" placeholder="Enter search terms - use quotes for phrases" kw-clearable-input=""/>
这里提供的布局:
function setFocusToTextBox()
{
document.querySelector( '.input-group.dropdown input' ).focus();
}
setFocusToTextBox();
<div class="input-group dropdown" dropdown="" keyboard-nav="" is-open="opt.showFqDropdown"> <span style="position: relative;"> <input class="form-control ng-pristine ng-valid ng-scope ng-touched" ng-model="query.q" type="text" placeholder="Enter search terms - use quotes for phrases" kw-clearable-input=""/>
</span>
</div>
你可以使用autofocus
<input class="form-control ng-pristine ng-valid ng-scope ng-touched" ng-
model="query.q"
type="text"
placeholder="Enter search terms - use quotes for phrases"
kw-clearable-input=""
autofocus>