Bogue ou pas avec Firefox ?
Bonjour,
J'étais en train de tester un code pour redimensionner une image avant envoi PHP:
Voilà que le fait de mettre un 'alert' me bloque tout le code sous FireFox... alors que cela marche sous chrome....
Voici le code:
Voir l'endroit où j'ai mis : """ // <<<<<<< CE 'ALERT' BLOQUE FIREFOX MAIS PAS Chrome !!!!???? """
Je me suis basé sur ceci... http://tech.novapost.fr/redimensionn...t-lupload.html
Code:
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
| <!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Redimentionnement Image en JQUERY</title>
<script src="https://code.jquery.com/jquery-3.4.1.slim.min.js" integrity="sha384-J6qa4849blE2+poT4WnyKhv5vZF5SrPo0iEjwBvKU7imGFAV0wwj1yYfoRSJoZ+n" crossorigin="anonymous"></script>
<style type="text/css">
</style>
</head>
<body>
<p>Redimentionnement Image en JQUERY</p>
<img id = "img_Id2" src="" class="card-img" alt="no image found :-(">
<div for="imgFile_Id2" class="card-body">
<input name="imgFileData[]" id="imgFile_Id2" class="input-file" type="file" accept=".gif,.jpg,.png,.jpeg">
</div>
<script>
$(document).ready(function () {
$("[id^=img_Id]").click(function () { // CLIC === OK
imgSource = $(this);
input = imgSource.parent().find('input');
input.click();
});
$("[id^=imgFile]").change(function () { // OK
readURL2(this);
});
function readURL2(input) {
var current_file = input.files[0];
var reader = new FileReader();
if (current_file.type.indexOf('image') == 0) {
reader.onload = function (event) {
var image = new Image();
image.src = event.target.result;
alert(image.src); // <<<<<<< CE 'ALERT' BLOQUE FIREFOX MAIS PAS Chrome !!!!????
image.onload = function() {
// ICI OK pour FIREFOX & Chrome
alert('Je suis ici');
var maxWidth = 1024,
maxHeight = 1024,
imageWidth = image.width,
imageHeight = image.height;
if (imageWidth > imageHeight) {
if (imageWidth > maxWidth) {
imageHeight *= maxWidth / imageWidth;
imageWidth = maxWidth;
}
}
else {
if (imageHeight > maxHeight) {
imageWidth *= maxHeight / imageHeight;
imageHeight = maxHeight;
}
}
var canvas = document.createElement('canvas');
canvas.width = imageWidth;
canvas.height = imageHeight;
image.width = imageWidth;
image.height = imageHeight;
var ctx = canvas.getContext("2d");
ctx.drawImage(this, 0, 0, imageWidth, imageHeight);
$("#img_Id2").attr('src', canvas.toDataURL(current_file.type));
}
};
reader.readAsDataURL(current_file);
}
}
});
</script> |
Est-ce un beug ou est-ce normal ?
Merci
