All geek questions in one place

JQuery not starting in Safari on submit form

I have a particular problem that gives me headaches ... The following code works fine in Firefox, but not in Safari on Mac OS.

I want to display a simple “Download message” while downloading files. So my page looks like this:

<!doctype html> <html> <head> <meta charset="utf-8"> <title></title> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script> <script> $(document).ready(function () { $('#upload').on('submit', function () { $("#loading").fadeIn(); }); }); </script> </head> <body> <p id="loading" style="display:none">UPLOADING...</p> <form name="upload" id="upload" method="post" action="upload.php" enctype="multipart/form-data"> <input type='file' name='file[]' multiple/> <input type="submit" value="Upload..."/> </form> </body> </html>

In Firefox, the string "UPLOADING ..." appears while the files are downloading before transferring me to upload.php. In Safari, the string "UPLOADING ..." is not displayed, and it transfers me to upload.php after downloading the files.

If this is not supported in Safari, how can I achieve exactly the same function?

Thank you for your help!

+4
source share
1 answer

Ok, I started to work ...

Instead of the send button, I changed it to 'button' with id = 'send'. I modified the script to show the p tag on click first, and then added the submit form in the callback as follows:

 <script> $(document).ready(function () { $("#send").click(function () { $("#loading").fadeIn(function () { $("#upload").submit(); }); }); }); </script>

And now it works in all browsers. Tested in IE, FF, Chrome and Safari.

+3
source

Source: https://habr.com/ru/post/1437191/

More articles:


All Articles