Câu trả lời:
Nếu bạn đang sử dụng jquery:
$(function() {
$("#Box1").focus();
});
hoặc nguyên mẫu:
Event.observe(window, 'load', function() {
$("Box1").focus();
});
hoặc javascript đơn giản:
window.onload = function() {
document.getElementById("Box1").focus();
};
mặc dù hãy nhớ rằng điều này sẽ thay thế các trình xử lý tải khác, vì vậy hãy tìm addLoadEvent () trong google để biết cách an toàn để nối các trình xử lý tải hơn là thay thế.
Trong HTML có một autofocus
thuộc tính cho tất cả các trường mẫu. Có một hướng dẫn tốt về nó trong Lặn vào HTML 5 . Thật không may, hiện tại nó không được hỗ trợ bởi các phiên bản IE dưới 10.
Để sử dụng thuộc tính HTML 5 và quay lại tùy chọn JS:
<input id="my-input" autofocus="autofocus" />
<script>
if (!("autofocus" in document.createElement("input"))) {
document.getElementById("my-input").focus();
}
</script>
Không yêu cầu trình xử lý jQuery, onload hoặc event, bởi vì JS nằm dưới phần tử HTML.
Chỉnh sửa: một ưu điểm khác là nó hoạt động với JavaScript tắt trong một số trình duyệt và bạn có thể xóa JavaScript khi bạn không muốn hỗ trợ các trình duyệt cũ hơn.
Chỉnh sửa 2: Firefox 4 hiện hỗ trợ autofocus
thuộc tính, chỉ cần rời khỏi IE mà không cần hỗ trợ.
autofocus="aufofocus"
? Tất cả các liên kết bạn cung cấp chỉ cần nói để thêm thuộc tính : autofocus
.
attribute="value"
các thuộc tính boolean. HTML5 xuất hiện cùng với "cú pháp thuộc tính trống" và chúng tôi đã loại bỏ sự dư thừa. Bây giờ chúng ta có thể làm<input checked disabled autofocus data-something>
Bạn cần sử dụng javascript:
<BODY onLoad="document.getElementById('myButton').focus();">
@Ben lưu ý rằng bạn không nên thêm các trình xử lý sự kiện như thế này. Trong khi đó là một câu hỏi khác, ông khuyên bạn nên sử dụng chức năng này:
function addLoadEvent(func) {
var oldonload = window.onload;
if (typeof window.onload != 'function') {
window.onload = func;
} else {
window.onload = function() {
if (oldonload) {
oldonload();
}
func();
}
}
}
Và sau đó thực hiện cuộc gọi tới addLoadEvent trên trang của bạn và tham chiếu một chức năng đặt trọng tâm cho hộp văn bản bạn muốn.
Đơn giản chỉ cần viết tự động lấy nét trong trường văn bản. Điều này là đơn giản và nó hoạt động như thế này:
<input name="abc" autofocus></input>
Hi vọng điêu nay co ich.
Bạn có thể làm điều đó một cách dễ dàng bằng cách sử dụng jquery theo cách này:
<script type="text/javascript">
$(document).ready(function () {
$("#myTextBoxId").focus();
});
</script>
bằng cách gọi chức năng này trong $(document).ready()
.
Nó có nghĩa là chức năng này sẽ thực thi khi DOM đã sẵn sàng.
Để biết thêm thông tin về chức năng SYN SÀNG, hãy tham khảo: http://api.jquery.com/ yet /
Sử dụng vanilla html và javascript đơn giản
<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>
Đối với những người sử dụng khung .net và asp.net 2.0 trở lên, tầm thường của nó. Nếu bạn đang sử dụng các phiên bản cũ hơn của khung, bạn cần viết một số javascript tương tự như trên.
Trong trình xử lý OnLoad của bạn (thường là page_load nếu bạn đang sử dụng mẫu trang chứng khoán được cung cấp với studio trực quan), bạn có thể sử dụng:
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
(* Lưu ý Tôi đã xóa ký tự gạch dưới khỏi tên hàm thường là Page_Load vì trong khối mã, nó đã từ chối hiển thị đúng! Tôi không thể thấy trong tài liệu đánh dấu làm thế nào để lấy dấu gạch dưới để hiển thị không bị xóa.)
Hi vọng điêu nay co ich.
<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>
Theo lời khuyên chung, tôi khuyên bạn không nên lấy cắp trọng tâm từ thanh địa chỉ. ( Jeff đã nói về điều đó. )
Trang web có thể mất một chút thời gian để tải, điều đó có nghĩa là sự thay đổi tiêu điểm của bạn có thể xảy ra trong một thời gian dài sau khi người dùng gõ URL pae. Sau đó, anh ta có thể đã thay đổi ý định và quay lại gõ url trong khi bạn sẽ tải trang của mình và lấy cắp trọng tâm để đặt nó vào hộp văn bản của bạn.
Đó là lý do duy nhất khiến tôi loại bỏ Google làm trang bắt đầu.
Tất nhiên, nếu bạn kiểm soát mạng (mạng cục bộ) hoặc nếu thay đổi tiêu điểm là để giải quyết vấn đề về khả năng sử dụng quan trọng, hãy quên tất cả những gì tôi vừa nói :)
Tôi đã có một vấn đề hơi khác nhau. Tôi muốn autofocus
, nhưng, muốn placeholder
văn bản vẫn còn, trình duyệt chéo. Một số trình duyệt sẽ ẩn placeholder
văn bản ngay khi trường tập trung, một số trình duyệt sẽ giữ nó. Tôi đã phải đặt các trình giữ chỗ ở trên trình duyệt chéo, có tác dụng phụ kỳ lạ hoặc ngừng sử dụng autofocus
.
Vì vậy, tôi đã lắng nghe khóa đầu tiên được gõ vào thẻ body và chuyển hướng khóa đó vào trường nhập liệu đích. Sau đó, tất cả những người xử lý sự kiện liên quan đều bị giết để giữ mọi thứ sạch sẽ.
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);
Nếu bạn đang sử dụng ASP.NET thì bạn có thể sử dụng
yourControlName.Focus()
trong mã trên máy chủ, sẽ thêm JavaScript thích hợp vào trang.
Các khung công tác phía máy chủ khác có thể có một phương thức tương đương.