image load en een css attribute werken niet

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

Daniel van Seggelen

Daniel van Seggelen

24/04/2024 14:57:12
Quote Anchor link
Beste,

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
$(document).on('change','#afbeelding',function(e){    
    //const size = this.files[0].size / 1024 / 1024;
    var _URL = window.URL || window.webkitURL;
   var file, img;
    var blah;
    var wid, ht;
    var sub = $('#submitLink');
    if ((file = this.files[0])) {
        img = new Image();
        img.onload = function () {
             wid = this.width;
             ht = this.height;

            if (wid < 728 || ht > 728)
            { console.log(wid);
              //$('#submitLink').attr('disabled','disabled');
             $('#submitLink').attr('style','display:none!important');
            } else {
              $('#submitLink').removeAttr('disabled');
            }
                 $('#blah').attr('src', URL.createObjectURL(file));
           // alert(wid);
          //  alert(ht);
        };
console.log(URL.createObjectURL(file));
        
         $('#blah').attr('src', URL.createObjectURL(file));
        img.src = _URL.createObjectURL(file);
    }
});


De code spreekt voor zich.
De img width laat hij zien in de console.log.

Maar #blah krijgt geen source, dus de img ord niet getoond.
En $('#submitLink').attr('style','display:none!important'); gebeurd niks mee.
Ook geen enkele foutmelding, dus vind dit heel vreemd.

Een id waarde moet toch globaal beschikbaar zijn?

MVG

Daniel

Toevoeging op 24/04/2024 15:00:43:

Als ik trouwens :

$('#submitLink').attr('style','display:none!important');

Net onder

$(document).on('change','#afbeelding',function(e){

plaats, dan gebeurd er hetzelfde. Terwijl die gewoon bestaat in een bootstrap modal waarin deze form #afbeelding geladen word

Toevoeging op 24/04/2024 16:12:46:

Kleine toevoeging.

Ik plaats dit er ook bij

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
if ($("#pic").length > 0)        // use this if you are using id to check
        {
             // it exists
            console.log('exists');
            $('#pic').attr('style','display:block');
        }


Een ander element, en hij geeft aan exist in console log, maar kan er niks mee doen.
Snap hier niks van, dit soort dingen is me nooit overkomen.
 
PHP hulp

PHP hulp

22/06/2024 09:24:38
 
Jan Koehoorn

Jan Koehoorn

29/04/2024 21:12:18
Quote Anchor link
Code niet getest, maar deze dingen vielen me op:

1. e.target.files ipv this.files
2. img.width ipv this.width
3. img.height ipv this.height
4. !important in een inline style? nonono ;-)
5. het src attribuut van #blah werd twee keer gezet

Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
$(document).on('change', '#afbeelding', (e) => {
    const _URL = window.URL || window.webkitURL
    let file, img
    let w, h

    if ((file = e.target.files[0])) {
        img = new Image()
        img.onload = () => {
            w = img.width
            h = img.height

            if (w < 728 || h > 728) {
                $('#submitLink').attr('style', 'display:none')
            } else {
                $('#submitLink').removeAttr('disabled')
            }
            $('#blah').attr('src', URL.createObjectURL(file))
        }
        img.src = _URL.createObjectURL(file)
    }
})
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.