X
Nhấn vào đây để đến phiên bản di động của trang web.

Diễn đàn trợ giúp

I am a web developer,using jquery,when i do $("#target").focus() it doesnt work on mozilla 64 bit , but works fine on chrome and Edge, even older version of IE

Được đăng

I am a web developer,using jquery.js and jquery.ui.css ,when i do $("#target").focus() on document .ready function for my first element which is actually a select element ,it doesnt work on mozilla 64 bit , but works fine on chrome and Edge, even older version of IE.

Like it has focus, because when i click tab it highlight the next element with proper border very well, but the first element when focused is not having any blue or a ny color border to show user that the element is in focus??

I am a web developer,using jquery.js and jquery.ui.css ,when i do $("#target").focus() on document .ready function for my first element which is actually a select element ,it doesnt work on mozilla 64 bit , but works fine on chrome and Edge, even older version of IE. Like it has focus, because when i click tab it highlight the next element with proper border very well, but the first element when focused is not having any blue or a ny color border to show user that the element is in focus??
Trích dẫn

Chi tiết hệ thống bổ sung

Phần bổ trợ đã cài đặt

  • Shockwave Flash 32.0 r0

Ứng dụng

  • Chuỗi đại diện người dùng: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:68.0) Gecko/20100101 Firefox/68.0

Thông tin chi tiết

Wesley Branton
  • Top 10 Contributor
573 giải pháp 4884 câu trả lời
Được đăng

Câu trả lời hữu ích

When it comes to issues with specific code, it's always helpful to have a test page that we can explore. Are you able to provide the exact code that you are using or a link to page using the code?

When it comes to issues with specific code, it's always helpful to have a test page that we can explore. Are you able to provide the exact code that you are using or a link to page using the code?
Bài viết này có hữu ích với bạn không? 1
Trích dẫn

Người tạo câu hỏi

please find js fiddle here , when i run this link in IE and chrome they work fine but not in firefox my select element is not focused on page load

https://jsfiddle.net/9zjqkymh/

please find js fiddle here , when i run this link in IE and chrome they work fine but not in firefox my select element is not focused on page load https://jsfiddle.net/9zjqkymh/
Bài viết này có hữu ích với bạn không?
Trích dẫn

Người tạo câu hỏi

i checked on 32 bit firefox too , but that doesnt make any difference

i checked on 32 bit firefox too , but that doesnt make any difference
Bài viết này có hữu ích với bạn không?
Trích dẫn
cor-el
  • Top 10 Contributor
  • Moderator
17345 giải pháp 156782 câu trả lời
Được đăng

There are possible issues in Firefox with styling a select element.

There are possible issues in Firefox with styling a select element. *https://developer.mozilla.org/en-US/docs/Web/HTML/Element/select
Bài viết này có hữu ích với bạn không? 0
Trích dẫn

Người tạo câu hỏi

I undertstand but focus is a basic functionality and not some external CSS working on it ...so I think it should work right !

I undertstand but focus is a basic functionality and not some external CSS working on it ...so I think it should work right !
Bài viết này có hữu ích với bạn không?
Trích dẫn
Wesley Branton
  • Top 10 Contributor
573 giải pháp 4884 câu trả lời
Được đăng

Your code works without any problems. The issue is that Firefox simply doesn't highlight focused elements like Google Chrome does. Every browser styles elements a little differently and Firefox simply as elected not to highlight focused elements.

You can easily see that it's working because when you press the up or down arrow keys, the options change in the select element. You won't see this on the JSFiddle page because the result box is unfocused when you run the code on there, but running it on a local HTML file will show you the true results.

The only way to get the highlighting would be to add some CSS code, like the following:

#target:focus {
     border: 1px solid blue;
}

Hope this helps.

Your code works without any problems. The issue is that Firefox simply doesn't highlight focused elements like Google Chrome does. Every browser styles elements a little differently and Firefox simply as elected not to highlight focused elements. You can easily see that it's working because when you press the up or down arrow keys, the options change in the select element. You won't see this on the JSFiddle page because the result box is unfocused when you run the code on there, but running it on a local HTML file will show you the true results. The only way to get the highlighting would be to add some CSS code, like the following: <pre><nowiki>#target:focus { border: 1px solid blue; }</nowiki></pre> Hope this helps.
Bài viết này có hữu ích với bạn không? 0
Trích dẫn

Người tạo câu hỏi

https://jsfiddle.net/a70pxgwf/2/

please run above fiddle in chrome and IE , it works fine BUT if I run the same in firefox after I apply class to the target it still doesn't apply the css , does this mean that firefox doesn't understand when the element is focused and when it is not?

https://jsfiddle.net/a70pxgwf/2/ please run above fiddle in chrome and IE , it works fine BUT if I run the same in firefox after I apply class to the target it still doesn't apply the css , does this mean that firefox doesn't understand when the element is focused and when it is not?
Bài viết này có hữu ích với bạn không?
Trích dẫn
TyDraniu
  • Top 25 Contributor
301 giải pháp 1686 câu trả lời
Được đăng

In Firefox the <iframe> breaks your example, see bug 1272328.

PS. Your function $("#target").focus() is empty, so it's needless.

In Firefox the <iframe> breaks your example, see [https://bugzilla.mozilla.org/show_bug.cgi?id=1272328 bug 1272328]. PS. Your function $("#target").focus() is empty, so it's needless.

Được chỉnh sửa bởi TyDraniu vào

Bài viết này có hữu ích với bạn không? 0
Trích dẫn

Người tạo câu hỏi

my question is how to solve this ,,,,this is such a basic function then how can it is not entertained by firefox

my question is how to solve this ,,,,this is such a basic function then how can it is not entertained by firefox
Bài viết này có hữu ích với bạn không?
Trích dẫn
TyDraniu
  • Top 25 Contributor
301 giải pháp 1686 câu trả lời
Được đăng

It should work outside <iframe>.

It should work outside <iframe>.
Bài viết này có hữu ích với bạn không? 0
Trích dẫn
Wesley Branton
  • Top 10 Contributor
573 giải pháp 4884 câu trả lời
Được đăng

I can confirm, like TyDraniu said, that the code does work outside of an <iframe>.

I can confirm, like TyDraniu said, that the code does work outside of an <code><iframe></code>.
Bài viết này có hữu ích với bạn không? 0
Trích dẫn

Người tạo câu hỏi

please see below reply!

please see below reply!

Được chỉnh sửa bởi apoorva.nagar vào

Bài viết này có hữu ích với bạn không?
Trích dẫn
Wesley Branton
  • Top 10 Contributor
573 giải pháp 4884 câu trả lời
Được đăng

Do you have a live copy of the code that you are using? The code you provided previously works without issue.

Do you have a live copy of the code that you are using? The code you provided previously works without issue.
Bài viết này có hữu ích với bạn không? 0
Trích dẫn

Người tạo câu hỏi

see this code here :

https://jsfiddle.net/wg583xp4/


my code is not in any iframe and this is my code in html hierarchy

its a simple code !

the only difference between fiddle code and my code is , that my select is being created in cshtml and the html helper class creates it.

but the end product iin HTML looks like the fiddle code itself

see this code here : https://jsfiddle.net/wg583xp4/ my code is not in any iframe and this is my code in html hierarchy its a simple code ! the only difference between fiddle code and my code is , that my select is being created in cshtml and the html helper class creates it. but the end product iin HTML looks like the fiddle code itself
Bài viết này có hữu ích với bạn không?
Trích dẫn

Người tạo câu hỏi

for my firefox browser it doesn't applies the CSS , how come its working for ya?

for my firefox browser it doesn't applies the CSS , how come its working for ya?
Bài viết này có hữu ích với bạn không?
Trích dẫn
Wesley Branton
  • Top 10 Contributor
573 giải pháp 4884 câu trả lời
Được đăng

Just checked and there is no issue with the code. The drop-down menu is automatically focused when the page is loaded. You can confirm this simply by pressing the up and down arrow on the keyboard to change the value of the drop-down.

However, as it was already mentioned above (which is where the <iframe> talk came from), the demo won't work on JSFiddle because the output code is in an <iframe> on there. However, if you copy and paste it into an HTML file, it works perfectly.

Just checked and there is no issue with the code. The drop-down menu is automatically focused when the page is loaded. You can confirm this simply by pressing the up and down arrow on the keyboard to change the value of the drop-down. However, as it was already mentioned above (which is where the <code><iframe></code> talk came from), the demo won't work on JSFiddle because the output code is in an <code><iframe></code> on there. However, if you copy and paste it into an HTML file, it works perfectly.
Bài viết này có hữu ích với bạn không?
Trích dẫn
Wesley Branton
  • Top 10 Contributor
573 giải pháp 4884 câu trả lời
Được đăng

As a side note, focusing the input with jQuery is redundant and unnecessary because you have given the form field the autofocus attribute, which essentially does the same thing. That's supported by all browsers, so unless there is a specific reason that you need the jQuery, you can safely exclude it.

As a side note, focusing the input with jQuery is redundant and unnecessary because you have given the form field the <code>autofocus</code> attribute, which essentially does the same thing. That's supported by all browsers, so unless there is a specific reason that you need the jQuery, you can safely exclude it.
Bài viết này có hữu ích với bạn không?
Trích dẫn
Wesley Branton
  • Top 10 Contributor
573 giải pháp 4884 câu trả lời
Được đăng

apoorva.nagar said

for my firefox browser it doesn't applies the CSS , how come its working for ya?

Are there any errors in the Developer Tools Console?

''apoorva.nagar [[#answer-1239649|said]]'' <blockquote>for my firefox browser it doesn't applies the CSS , how come its working for ya?</blockquote> Are there any errors in the Developer Tools Console?
Bài viết này có hữu ích với bạn không?
Trích dẫn

Người tạo câu hỏi

yes its jquery reference error, let me try with javascript directly after I remove autofocus

yes its jquery reference error, let me try with javascript directly after I remove autofocus
Bài viết này có hữu ích với bạn không?
Trích dẫn
Wesley Branton
  • Top 10 Contributor
573 giải pháp 4884 câu trả lời
Được đăng

Do you have the jQuery library included on your HTML page? You need this in order to use jQuery on your page. You can either download the jQuery library or add a script tag from a CDN.

Try adding the following code directly before the <script> that contains your jQuery code: <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

Do you have the jQuery library included on your HTML page? You need this in order to use jQuery on your page. You can either download the jQuery library or add a script tag from a CDN. Try adding the following code directly before the <code><script></code> that contains your jQuery code: <code><script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script></code>
Bài viết này có hữu ích với bạn không? 0
Trích dẫn
Đặt một câu hỏi

Bạn phải đăng nhập vào tài khoản của bạn để trả lời bài viết. Vui lòng bắt đầu một câu hỏi mới, nếu bạn chưa có tài khoản.