document.getElementById (id) .focus() không làm việc cho firefox hoặc chrome

Question

Khi bao giờ tôi làm onchange sự kiện, nó đi bên trong hàm Validating của nó, Nhưng trọng tâm không đến Tôi đang sử dụng document.getElementById('controlid').focus();

Tôi bằng cách sử dụng Mozilla Firefox và Google Chrome, cả hai đều không hoạt động. Tôi không muốn bất kỳ trình duyệt IE nào. Bất kỳ ai có thể cho tôi biết tôi có thể lý do gì không.

Cảm ơn trước

Dưới đây là các mã:

var mnumber = document.getElementById('mobileno').value; 
if(mnumber.length >=10) { 
    alert("Mobile Number Should be in 10 digits only"); 
    document.getElementById('mobileno').value = ""; 
    document.getElementById('mobileno').focus(); 
    return false; 
} 

Answer 1

Nếu bạn có quyền truy cập vào jQuery hoặc Zepto.js, công trình này

$('#mobileno').focus(); 

Answer 2

Tôi cũng đề nghị bạn tập trung của jQuery() chức năng. Cuộc sống của bạn sẽ trở nên đơn giản :) Một số thời gian trước đây tôi đã nhận được vấn đề với tập trung (w/o jQuery) và tôi đã bỏ cuộc.

Answer 3

Hãy thử sử dụng một bộ đếm thời gian:

var mnumber = document.getElementById('mobileno').value; 
if (mnumber.length >=10) 
{ 
    alert("Mobile Number Should be in 10 digits only"); 
    document.getElementById('mobileno').value = ""; 
    window.setTimeout(function() 
    { 
     document.getElementById('mobileno').focus(); 
    }, 0); 
    return false; 
} 

Một giờ với một số từ 0 sẽ chạy khi thread trở nên nhàn rỗi. Nếu điều đó không hữu ích, hãy thử mã (với bộ hẹn giờ) trong sự kiện onblur thay thế.

Answer 4

Bạn đang cố gắng tham chiếu phần tử trước khi DOM tải xong?

Mã của bạn nên đi trong tải cơ thể (hoặc một chức năng cần thực hiện khi DOM đã được nạp, như $(document).ready() trong jQuery)

body.onload = function() { 
    // your onchange event handler should be in here too 
    var mnumber = document.getElementById('mobileno').value; 
    if(mnumber.length >=10) { 
     alert("Mobile Number Should be in 10 digits only"); 
     document.getElementById('mobileno').value = ""; 
     document.getElementById('mobileno').focus(); 
     return false; 
    }  
} 

Answer 5

Hãy chắc chắn rằng bạn sử dụng "id" và "getElementById" như hình tại đây:

<FORM id="my_form" name="my_form" action=""> 
<INPUT TYPE="text" NAME="somefield" ID="somefield" onChange="document.getElementById('my_form').submit();"> 
</FORM> 

Answer 6

Thời gian chờ được đề xuất ở trên đã giải quyết được sự cố trên Chrome. Không có vấn đề tồn tại trên IE8 hoặc FF3. Cảm ơn cho tip như mọi khi. Mã của tôi rằng để thiết lập tập trung mà làm việc là: window.setTimeout(function() { document.form1.password.focus(); },0);

Answer 7

Thêm một điều khiển, nơi mà bạn muốn thiết lập tập trung sau đó thay đổi thuộc tính của nó như dưới đây

<asp:TextBox ID="txtDummy" runat="server" Text="" Width="2" ReadOnly="true" BorderStyle="None" BackColor="Transparent"></asp:TextBox> 

Trong codebehind, chỉ cần gọi như dưới đây txtDummy.Focus()

phương pháp này hoạt động trên tất cả các trình duyệt.

Answer 8

Đối với việc trở lại tập trung phải nhập lại mật khẩu hộp văn bản trong javascript:

window.setTimeout(function() { document.forms["reg"]["retypepwd"].focus(); },0); 

Ở đây, reg là tên mẫu đăng ký.

Answer 9

window.setTimeout(function() { 
    document.getElementById('mobileno').focus(); 
}, 0); 

Điều này cũng phù hợp với tôi. Firefox sẽ đặt giá trị của phần tử của tôi, nhưng không tập trung vào nó.

Answer 10

Không phải tất cả các phần tử đều có thể lấy tiêu điểm nhưng mặc định, có thuộc tính tabindex để sửa lỗi đó.

Khi bạn chỉ định tabindex = cho một phần tử:

Nó trở nên tập trung. Người dùng có thể sử dụng phím tab để di chuyển từ phần tử có tabindex kém tích cực sang tab tiếp theo. Ngoại lệ là một giá trị đặc biệt tabindex = "0" có nghĩa là phần tử sẽ luôn là cuối cùng. Tabindex = -1 có nghĩa là một phần tử sẽ trở thành tiêu điểm, nhưng phím tab sẽ luôn bỏ qua nó. Chỉ có phương pháp tập trung() sẽ làm việc

Answer 11

2 điều cần đề cập đến nếu focus() không làm việc:

• sử dụng chức năng này sau khi phụ thêm để mẹ
• nếu console được chọn, sau khi trang làm mới, yếu tố sẽ không đạt được tập trung, vì vậy hãy chọn (nhấp vào) trang web trong khi thử nghiệm

Cách này hoạt động trong cả Firefox và Chrome mà không cần bất kỳ setTimeOut().

Answer 12

Tiêu điểm của bạn đang hoạt động trước khi trả về false; , Sau đó là không làm việc. Bạn thử giải pháp này. Kiểm soát sau khi trả về false;

đang Đặt chức năng:

function validateNumber(){ 
    var mnumber = document.getElementById('mobileno').value; 
    if(mnumber.length >=10) { 
     alert("Mobile Number Should be in 10 digits only"); 
     document.getElementById('mobileno').value = ""; 
     return false; 
    }else{ 
     return true; 
    } 
} 

Caller chức năng:

function submitButton(){ 
     if(!validateNumber()){ 
      document.getElementById('mobileno').focus(); 
      return false; 
     } 
} 

HTML:

Input:<input type="text" id="mobileno"> 
<button onclick="submitButton();" >Submit</button> 

Answer 13

Tôi biết điều này có thể là một trường hợp sử dụng bí truyền nhưng tôi phải vật lộn với việc một đầu vào để tập trung khi sử dụng khung công tác Angular 2. Gọi trọng tâm() chỉ đơn giản là không làm việc không quan trọng những gì tôi đã làm.

Cuối cùng tôi nhận ra góc là đã chặn nó vì tôi chưa đặt [(ngModel)] trên đầu vào. Thiết lập một giải quyết nó. Hy vọng nó sẽ giúp ai đó.

Answer 14

Trường hợp của tôi hơi khác một chút. Tôi đã cố gắng để focus() một đầu vào từ bên trong bảng điều khiển dành cho nhà phát triển trình duyệt. Hóa ra nó đã can thiệp vào đầu vào bằng cách nào đó, và một khi tôi giảm thiểu giao diện điều khiển mọi thứ đã làm việc như mong đợi. Tôi hiểu đây không phải là một giải pháp chương trình, nhưng trong trường hợp ai đó tìm thấy điều này trên một jist công cụ tìm kiếm như tôi đã làm, có một cơ hội thông tin này có thể giúp đỡ.

Answer 15

Tôi nghi ngờ lý do hoạt động này là hiển thị trình duyệt chạy trên cùng một luồng như javascript và setTimeout (function() {}, 0); xếp hàng hàm javascript bên trong setTimeout để thực thi khi trình duyệt không hoạt động. Nếu bất cứ ai có một lời giải thích sâu hơn hãy chia sẻ nó.

setTimeout(function(){ 
if(document.getElementById('mobileno')){ 
    document.getElementById('mobileno').focus(); 
} 
},0); 

Answer 16

Một điều nữa để thêm vào danh sách này để kiểm tra:

Hãy chắc chắn rằng các yếu tố bạn đang cố gắng tập trung không phải là bản thân cũng không được chứa trong một phần tử với "display: none" tại thời điểm bạn đang cố gắng tập trung nó.

Answer 17

Nơi nguồn này trên modal của bạn:

<script> 
$('body').on('shown.bs.modal', '#IdYourModal', function() { 
    document.getElementById('mobileno').focus(); 
}) 
</script>