Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

onclick function returns undefined in IE, works fine in Chrome and Firefox

I have a HTML page like this (simplified)

<html>
  <head>
    <style>
...
    </style>
    <script type ="text/javascript">
      function foo()
      {
...
      }
    </script>
  </head>
  <body>
    <input type="button" value="ClickMe" onClick="foo()"/>
  </body>
</html>

This works fine on Chrome, Firefox and Safari, but when I use IE, when I click, it returns 'foo' is undefined in the console logs. I tried moving all section inside but still got the same issue. Any hints?

EDIT 1 : here is more of my code

<?xml version="1.0" encoding="ISO-8859-1"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
  <head>
    <meta content="text/html;charset=utf-8" http-equiv="Content-Type"/>
    <meta content="utf-8" http-equiv="encoding"/>
    <title>My Title</title>

    <script type="text/javascript">
      function handleBrowseClick()
      {
        var fileinput = document.getElementById("browse");
        fileinput.click();
      }

      function handleChange()
      {
        var fileinput = document.getElementById("browse");
      }

      function addListener()
      {
        document.getElementById('browse').addEventListener('change', handleFileSelect, false);
      }

      function handleFileSelect(evt)
      {
        var files = evt.target.files;

        var output = [];
        for (var i=0 ; f=files[i] ; i++) {
          var reader = new FileReader();
          reader.onload = (function(theFile) {
            return function(e) {
              <more JS code here>
            };
          })(f);
          reader.readAsBinaryString(f);
        }
      }
    </script>
  </head>
  <body>
    <input type="file" id="browse" name="fileupload" style="display: none" onChange="handleChange();"/>
    <input type="button" value="ClickMe" id="fakeBrowse" onClick="handleBrowseClick();"/>
    <output id="list"></output>
  </body>
</html>

<script type="text/javascript">
  window.onload = addListener();
</script>
like image 772
rh4games Avatar asked Dec 05 '25 10:12

rh4games


1 Answers

I had just came across the same problem.

For me, it was because the HTML had some syntax errors that Chrome (even Microsoft Edge) doesn't complain about but Internet Explorer does.

As soon as I fixed those the undefined function error was gone.

like image 113
Salma Hassan Avatar answered Dec 06 '25 22:12

Salma Hassan



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!