locked
I can't set focus to my textbox with this code RRS feed

  • Question

  • User-2071692902 posted

    Hi,

    Im trying to set focus to my username textbox at page laod but I failed. What's the wrong with this code?

    <body>
        <script >
    window.onload = function() {
      document.getElementById("myUserName").focus();
    };
    </script>
    Username:
       <div class=" UsernameLabelDiv">
     <input id="myUserName"
           type="text" 
           style="width: 280px" 
           placeholder="Username" 
           maxlength="15"
           onkeyup="saveValue(this)"
           onkeypress="return AvoidSpace(event)">
    </div>

    Thursday, March 7, 2019 7:08 AM

Answers

  • User-1174608757 posted

    Hi , Omanxp45-1

    According to your code ,I have tried on side. It works well. So I suggest you to use browser and enter F12 to see if there is anything wrong with your code.Like this:

    Here is my test, I hope it could help you.

    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        
    </head>
    <body>
        <script >
    window.onload = function() {
      document.getElementById("myUserName").focus();
    };
    </script>
        <form id="form1" runat="server">
            <div>
                Username:
       <div class=" UsernameLabelDiv">
     <input id="myUserName"
           type="text" 
           style="width: 280px" 
           placeholder="Username" 
           maxlength="15"
          />
    </div>
            </div>
        </form>
    </body>
    </html>
    

    It shows as below when page load. 

    So if you still couldn't show focus on textbox, I hope you could post more details about your code in front end. I think there is nothing wrong with codes you provided in this case.

    Best Regards

    Wei

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, March 7, 2019 8:56 AM
  • User-1174608757 posted

    Hi Omanxp45-1,

    According to your page I find that it has error on your page , you could see as below:

    This problem may cause other code doesn't work well on your page. So I think you should solve it  firstly.This error happens because security reasons, your local drive is declared to be "other-domain" and will taint the canvas.(That's because your most sensitive info is likely on your local drive!).I suggest you to do as below:

    • Put all page related files (.html, .jpg, .js, .css, etc) on your desktop (not in sub-folders).

    • Post your images to a site that supports cross-domain sharing (like dropbox.com). Be sure you put your images in dropbox's public folder and also set the cross origin flag when downloading the image (var img=new Image(); img.crossOrigin="anonymous" ...)

    • Install a webserver on your development computer (IIS web servers  has free editions that work nicely on a local computer).

    Here is the link, I hope it could help you.

    https://stackoverflow.com/questions/22710627/tainted-canvases-may-not-be-exported

    Best Regards

    Wei Zhang

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, March 8, 2019 1:53 AM

All replies

  • User-1174608757 posted

    Hi , Omanxp45-1

    According to your code ,I have tried on side. It works well. So I suggest you to use browser and enter F12 to see if there is anything wrong with your code.Like this:

    Here is my test, I hope it could help you.

    <!DOCTYPE html>
    
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head runat="server">
        <title></title>
        
    </head>
    <body>
        <script >
    window.onload = function() {
      document.getElementById("myUserName").focus();
    };
    </script>
        <form id="form1" runat="server">
            <div>
                Username:
       <div class=" UsernameLabelDiv">
     <input id="myUserName"
           type="text" 
           style="width: 280px" 
           placeholder="Username" 
           maxlength="15"
          />
    </div>
            </div>
        </form>
    </body>
    </html>
    

    It shows as below when page load. 

    So if you still couldn't show focus on textbox, I hope you could post more details about your code in front end. I think there is nothing wrong with codes you provided in this case.

    Best Regards

    Wei

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Thursday, March 7, 2019 8:56 AM
  • User-2071692902 posted

    Hi Wei Zhang,

    Thanks, but unfortunately it didn't work.

    Here the whole page.Here.

    Thursday, March 7, 2019 10:28 PM
  • User-1174608757 posted

    Hi Omanxp45-1,

    According to your page I find that it has error on your page , you could see as below:

    This problem may cause other code doesn't work well on your page. So I think you should solve it  firstly.This error happens because security reasons, your local drive is declared to be "other-domain" and will taint the canvas.(That's because your most sensitive info is likely on your local drive!).I suggest you to do as below:

    • Put all page related files (.html, .jpg, .js, .css, etc) on your desktop (not in sub-folders).

    • Post your images to a site that supports cross-domain sharing (like dropbox.com). Be sure you put your images in dropbox's public folder and also set the cross origin flag when downloading the image (var img=new Image(); img.crossOrigin="anonymous" ...)

    • Install a webserver on your development computer (IIS web servers  has free editions that work nicely on a local computer).

    Here is the link, I hope it could help you.

    https://stackoverflow.com/questions/22710627/tainted-canvases-may-not-be-exported

    Best Regards

    Wei Zhang

    • Marked as answer by Anonymous Thursday, October 7, 2021 12:00 AM
    Friday, March 8, 2019 1:53 AM