Làm cách nào để tập trung vào trường văn bản nhập biểu mẫu khi tải trang bằng jQuery?

186

Điều này có thể rất đơn giản, nhưng ai đó có thể cho tôi biết cách để con trỏ nhấp nháy trên một hộp văn bản khi tải trang?Làm cách nào để tập trung vào trường văn bản nhập biểu mẫu khi tải trang bằng jQuery?

Nguồn

2009-10-20 chris

+81

Chúng tôi không quan tâm câu hỏi đơn giản ở đây. – DOK

Kiểm tra câu trả lời từ ahail arif ở bên dưới liên kết: http://stackoverflow.com/questions/18054459/how-to-place-the-cursor-auto-focus-in-text-box-when-a-page-gets- load-without –

292

Set tập trung vào các lĩnh vực văn bản đầu tiên:

$("input:text:visible:first").focus();

này cũng thực hiện các lĩnh vực văn bản đầu tiên, nhưng bạn có thể thay đổi [0] đến một chỉ số:

$('input[@type="text"]')[0].focus();

Hoặc, bạn có thể sử dụng ID:

$("#someTextBox").focus();

Nguồn

2009-10-20 00:52:41 DOK

+15

"Cách .... ** sử dụng Jquery **" – pjmil

Nếu sử dụng hộp thoại, vui lòng xem câu trả lời này nếu ở trên không hoạt động http://stackoverflow.com/a/20629541/966609 –

'$ ('đầu vào [ type = "text"] '). get (0) .focus(); '... làm việc cho tôi – Rav

chắc:

<head> 
    <script src="jquery-1.3.2.min.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(function() { 
      $("#myTextBox").focus(); 
     }); 
    </script> 
</head> 
<body> 
    <input type="text" id="myTextBox"> 
</body>

Nguồn

2009-10-20 00:51:10 Pandincus

HTML:

<input id="search" size="10" />

jQuery:

$("#search").focus();

Nguồn

2009-10-20 00:51:18 brendan

nếu sử dụng html5, chỉ cần thêm thuộc tính 'autofocus' vào phần tử input? –

Hãy suy nghĩ về giao diện người dùng của bạn trước khi bạn làm cái này. Tôi giả sử (mặc dù không có câu trả lời nào đã nói như vậy) rằng bạn sẽ làm điều này khi tài liệu tải bằng cách sử dụng chức năng ready() của jQuery. Nếu người dùng đã tập trung vào một yếu tố khác trước khi tài liệu được tải (điều này là hoàn toàn có thể) thì điều đó cực kỳ khó chịu để họ lấy đi tiêu điểm bị đánh cắp.

Bạn có thể kiểm tra điều này bằng cách thêm onfocus thuộc tính trong mỗi <input> yếu tố của bạn để ghi lại xem người dùng đã tập trung vào một lĩnh vực hình thức và sau đó không ăn cắp tập trung nếu họ có:

var anyFieldReceivedFocus = false; 

function fieldReceivedFocus() { 
    anyFieldReceivedFocus = true; 
} 

function focusFirstField() { 
    if (!anyFieldReceivedFocus) { 
     // Do jQuery focus stuff 
    } 
} 


<input type="text" onfocus="fieldReceivedFocus()" name="one"> 
<input type="text" onfocus="fieldReceivedFocus()" name="two">

Nguồn

2009-10-20 08:51:18

cảm ơn vì điều này. đây là một bổ sung tốt! – chris

Quan điểm của bạn không chỉ đúng về mặt kỹ thuật, mà việc bạn xem xét cho UX tốt nhất có thể là tinh tế. Bravo! – Maviza101

Xin lỗi vì va chạm một câu hỏi cũ. Tôi tìm thấy điều này thông qua google.

Cần lưu ý rằng có thể sử dụng nhiều bộ chọn, do đó bạn có thể nhắm mục tiêu bất kỳ phần tử biểu mẫu nào và không chỉ một loại cụ thể.

ví dụ:

$('#myform input,#myform textarea').first().focus();

Điều này sẽ tập trung đầu vào hoặc văn bản đầu tiên tìm thấy và tất nhiên bạn cũng có thể thêm bộ chọn khác vào danh sách kết hợp. Hnady nếu bạn không thể chắc chắn về một loại yếu tố cụ thể được đầu tiên, hoặc nếu bạn muốn một cái gì đó một chút chung/tái sử dụng.

Nguồn

2013-04-07 21:45:17

Đề xuất tuyệt vời @Andrew. – DOK

diễn ra sau khi đầu vào

<script type="text/javascript">document.formname.inputname.focus();</script>

Nguồn

2013-08-16 01:34:59

Tại sao tất cả mọi người sử dụng jQuery cho một cái gì đó đơn giản như thế này.

<body OnLoad="document.myform.mytextfield.focus();">

Nguồn

2013-09-09 09:09:48

+1 Cách đơn giản nhất! –

Vì câu hỏi được gắn thẻ là jQuery. –

Đây là những gì tôi thích sử dụng:

<script type="text/javascript"> 
    $(document).ready(function() { 
     $("#fieldID").focus(); 
    }); 
</script>

Nguồn

2014-01-15 16:52:49 SynD

Đó là cách xấu để thực hiện mọi thứ, để tập trung vào một tài liệu khi tải tài liệu, chỉ cần sử dụng thuộc tính 'autofocus' được cung cấp bởi tự động lấy nét tự động HTML5 – OverCoder

Bạn có thể sử dụng HTML5 autofocus cho việc này. Bạn không cần jQuery hoặc JavaScript khác.

<input type="text" name="some_field" autofocus>

Lưu ý điều này sẽ không hoạt động trên IE9 trở xuống.

Nguồn

2014-10-12 23:58:31

không hoạt động trong IE11 hoặc https://stackoverflow.com/questions/34068302/autofocus-attribute -on-input-field-not-working-in-ie-11 –

Cách đơn giản và dễ dàng nhất để đạt được điều này

$('#button').on('click', function() { 
    $('.form-group input[type="text"]').attr('autofocus', 'true'); 
});

Nguồn

2018-02-13 06:31:09

Làm cách nào để tập trung vào trường văn bản nhập biểu mẫu khi tải trang bằng jQuery?

Trả lời

Các vấn đề liên quan