웹 페이지가 로드될 때 자동으로 텍스트 상자에 포커스를 설정하는 방법은 무엇입니까?
웹 페이지가 로드될 때 자동으로 텍스트 상자에 포커스를 설정하는 방법은 무엇입니까?
HTML 태그가 있나요 아니면 자바스크립트로 해야 하나요?
jquery를 사용하는 경우:
$(function() {
$("#Box1").focus();
});
또는 프로토타입:
Event.observe(window, 'load', function() {
$("Box1").focus();
});
또는 일반 자바스크립트:
window.onload = function() {
document.getElementById("Box1").focus();
};
이것이 다른 온로드 핸들러들을 대체할 것이라는 것을 명심하기 때문에, 교체하는 것보다 온로드 핸들러를 추가할 수 있는 안전한 방법을 Google에서 addLoadEvent()를 찾아보십시오.
HTML에는 모든 양식 필드에 속성이 있습니다.Dive Into HTML 5에는 좋은 튜토리얼이 있습니다. 안타깝게도 현재 10개 미만의 IE 버전에서는 지원되지 않습니다.
HTML 5 특성을 사용하고 JS 옵션으로 폴백하려면:
<input id="my-input" autofocus="autofocus" />
<script>
if (!("autofocus" in document.createElement("input"))) {
document.getElementById("my-input").focus();
}
</script>
JS가 HTML 요소 아래에 있으므로 jQuery, onload 또는 이벤트 핸들러가 필요하지 않습니다.
편집: 일부 브라우저에서 자바스크립트를 해제한 상태에서 작동하며 오래된 브라우저를 지원하지 않을 때 자바스크립트를 제거할 수 있다는 것도 장점입니다.
편집 2: Firefox 4는 이제autofocus속성, 지원 없이 IE를 떠나는 것입니다.
javascript를 사용해야 합니다.
<BODY onLoad="document.getElementById('myButton').focus();">
@Ben은 이와 같은 이벤트 핸들러를 추가해서는 안 된다고 지적합니다.또 다른 질문이지만, 이 기능을 사용할 것을 권장합니다.
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}
그런 다음 페이지에 LoadEvent를 추가하고 원하는 텍스트 상자에 포커스를 설정하는 기능을 참조합니다.
텍스트 필드에 자동 포커스를 입력하기만 하면 됩니다.이는 간단하며 다음과 같이 작동합니다.
<input name="abc" autofocus></input>
도움이 되길 바랍니다.
jquery를 다음과 같은 방법으로 쉽게 사용할 수 있습니다.
<script type="text/javascript">
$(document).ready(function () {
$("#myTextBoxId").focus();
});
</script>
이 함수를 호출하여$(document).ready().
이것은 DOM이 준비되면 이 기능이 실행된다는 것을 의미합니다.
READY 기능에 대한 자세한 내용은 http://api.jquery.com/ready/ 을 참조하십시오.
플레인 바닐라 html과 자바스크립트 사용
<input type='text' id='txtMyInputBox' />
<script language='javascript' type='text/javascript'>
function SetFocus()
{
// safety check, make sure its a post 1999 browser
if (!document.getElementById)
{
return;
}
var txtMyInputBoxElement = document.getElementById("txtMyInputBox");
if (txtMyInputBoxElement != null)
{
txtMyInputBoxElement.focus();
}
}
SetFocus();
</script>
.net 프레임워크 및 asp.net 2.0 이상을 사용하는 사용자에게는 사소한 것입니다.이전 버전의 프레임워크를 사용하는 경우 위와 유사한 자바스크립트를 작성해야 합니다.
OnLoad 핸들러(Visual Studio와 함께 제공되는 재고 페이지 템플릿을 사용하는 경우 일반적으로 page_load)에서 다음을 사용할 수 있습니다.
C#
protected void PageLoad(object sender, EventArgs e)
{
Page.SetFocus(txtMyInputBox);
}
VB.NET
Protected Sub PageLoad(sender as Object, e as EventArgs)
Page.SetFocus(txtMyInputBox)
End Sub
(* 코드 블록에서 제대로 렌더링하기를 거부했기 때문에 일반적으로 Page_Load인 함수 이름에서 밑줄 문자를 제거했습니다!마크업 설명서에서 밑줄을 사용하여 탈출하지 못하게 하는 방법을 볼 수 없었습니다.)
도움이 되길 바랍니다.
IMHO는 페이지에서 첫번째, 보이는, 활성화된 텍스트 필드를 선택하는 가장 '깨끗한' 방법으로 jQuery를 사용하고 다음과 같은 작업을 수행합니다.
$(document).ready(function() {
$('input:text[value=""]:visible:enabled:first').focus();
});
그게 도움이 되길..
고마워요...
<html>
<head>
<script language="javascript" type="text/javascript">
function SetFocus(InputID)
{
document.getElementById(InputID).focus();
}
</script>
</head>
<body onload="SetFocus('Box2')">
<input id="Box1" size="30" /><br/>
<input id="Box2" size="30" />
</body>
</html>
일반적인 조언으로는 주소창에서 초점을 훔치지 않는 것을 추천합니다.(Jeff는 이미 그것에 대해 이야기 했습니다.)
웹 페이지를 로드하는 데 시간이 걸릴 수 있습니다. 즉, 사용자가 pae URL을 입력한 후 시간이 오래 지나면 포커스가 변경될 수 있습니다.그러면 그는 마음을 바꿔서 url 타이핑으로 돌아갔을 수도 있고, 당신은 당신의 페이지를 로드하고 당신의 텍스트 상자에 그것을 넣기 위해 초점을 훔칠 것입니다.
그것이 제가 구글을 시작 페이지로 제거하게 된 유일한 이유입니다.
물론 네트워크(로컬 네트워크)를 제어하거나 초점 변경이 중요한 사용성 문제를 해결하는 것이라면 방금 한 말은 모두 잊어버리세요 :)
저는 조금 다른 문제가 있었습니다.갖고싶었어요autofocus , 를 .placeholder남아있는 텍스트, 교차 browser..placeholder현장이 초점을 맞추자마자, 몇몇은 그것을 보관할 것입니다. 크로스 다 .autofocus.
그래서 본문 태그에 대해 입력한 첫 번째 키를 듣고 해당 키를 대상 입력 필드로 리디렉션했습니다.그러면 관련된 모든 이벤트 처리자들이 일을 깨끗하게 유지하기 위해 죽임을 당합니다.
var urlInput = $('#Url');
function bodyFirstKey(ev) {
$('body').off('keydown', bodyFirstKey);
urlInput.off('focus', urlInputFirstFocus);
if (ev.target == document.body) {
urlInput.focus();
if (!ev.ctrlKey && !ev.metaKey && !ev.altKey) {
urlInput.val(ev.key);
return false;
}
}
};
function urlInputFirstFocus() {
$('body').off('keydown', bodyFirstKey);
urlInput.off('focus', urlInputFirstFocus);
};
$('body').keydown(bodyFirstKey);
urlInput.focus(urlInputFirstFocus);
https://jsfiddle.net/b9chris/qLrrb93w/
합니다 설정이 합니다.autofocus에 대해
<input type="text" class="b_calle" id="b_calle" placeholder="Buscar por nombre de calle" autofocus="autofocus">
자바스크립트 백업이 안되서 위의 Dave1010에서 답변을 수정했습니다.
<input type="text" id="my-input" />
그리고 자바스크립트 백업 검사:
if (!(document.getElementById("my-input").hasAttribute("autofocus"))) {
document.getElementById("my-input").focus();
}
ASP를 사용하는 경우.그러면 NET을 사용할 수 있습니다.
yourControlName.Focus()
적절한 자바스크립트를 페이지에 추가할 서버의 코드에 저장합니다.
다른 서버측 프레임워크에도 동일한 방법이 있을 수 있습니다.
아래 코드를 사용합니다.나에게는 효과가 있습니다.
jQuery("[id$='hfSpecialty_ids']").focus()
언급URL : https://stackoverflow.com/questions/45827/how-do-you-automatically-set-the-focus-to-a-textbox-when-a-web-page-loads
'programing' 카테고리의 다른 글
| 셸 / Perl 스크립트에서 암호를 유지하는 모범 사례는 무엇입니까? (0) | 2023.09.27 |
|---|---|
| 'packages' 요소가 선언되지 않았습니다. (0) | 2023.09.27 |
| .animate()의 콜백이 twice jquery로 호출됩니다. (0) | 2023.09.27 |
| C/C++ 공유 메모리에서 대기 후 알림 (0) | 2023.09.27 |
| 도커 컨테이너에서 여러 프로그램을 실행할 수 있습니까? (0) | 2023.09.27 |