jQuery if statement problem

Question

i am trying to change image in the div if the user click on any span,if div already contains roz variable(which comes from the index page) then by clickng on the span, img roz should not be appneded but it does not work.

i am not sure if the first part of IF statement in jQuery is right

here is html part

<div class="iconWrapper">
<ul class="color">
<li><a href="#" title="Selecteer"><span class="color1"></span></a> </li>
<li><a href="#" title="Selecteer "><span class="color2" ></span></a></li>
<li><a href="#" title="Selecteer"><span class="color3"></span></a> </l>
<li><a href="#" title="Selecteer"><span class="color4"></span></a></li>
</ul> </div>

<div id="div1" > <?php if(isset($_SESSION['img'])){
echo '<img src="' . $_SESSION['img'] . '" >' ; }
?>
<form method="post" action="weekDays.php">
<input name="kleur" type="text" value="" id="hiddencolor" />

<input name="submit" type="submit" value="Submit" />
</form> </div>

jQuery:

$(function(){
    var roz='../../photo/roz1.jpg';

    $('.iconWrapper span').click(function(e){
        var kleur=$(this).attr('class');
    if($('#div1').attr('src' == roz)){
        $('#div1' ).children('img').remove() ;
        $('#div1'). append('<img src="img/300.jpg" />');
    }else{
       $('#div1').children('img').remove();
       $('#div1').append('<img src="img/106.jpg" />');
    }
    e.preventDefault(); 
    alert(  $('#div1').html()  );       
});

});

What's your kleur variable for? You don't actually use it! Also, is #div1 actually an image tag? Because you've made it look like a div. — Eric
– Eric, Commented Jun 19, 2011 at 9:24
If you store the reference to $('#div1'). It will be faster. — GolezTrol
– GolezTrol, Commented Jun 19, 2011 at 9:26

Meep3D · Accepted Answer · 2011-06-19 09:19:05Z

6

if($('#div1').attr('src' == roz))

should be

if($('#div1').attr('src') == roz)

answered Jun 19, 2011 at 9:19

Meep3D

3,7564 gold badges38 silver badges58 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Eric · Accepted Answer · 2011-06-19 09:30:02Z

2

I'm thinking you actually want this:

$(function() {
    $('.iconWrapper span').click(function(e) {
        $('#div1').find('img').attr('src', function(index, src) {
            return src == '../../photo/roz1.jpg' ? 'img/300.jpg' : 'img/106.jpg';
        });
    });
    e.preventDefault();
});

Given that your current code seems to be looking for a src attribute on what I presume is a div.

answered Jun 19, 2011 at 9:30

Eric

98.1k54 gold badges257 silver badges389 bronze badges

1 Comment

Eric Over a year ago

@Juhana: More specifically, it's the conditional operator

andyb · Accepted Answer · 2011-06-19 09:21:59Z

2

The jQuery attr() is being used incorrectly. You need to use attr('src') to get the 'src' attribute and then compare it to your roz value.

answered Jun 19, 2011 at 9:21

andyb

43.9k12 gold badges126 silver badges155 bronze badges

Comments

thecodeparadox · Accepted Answer · 2011-06-19 09:18:25Z

1

try this:

$(function() {
    var roz = '../../photo/roz1.jpg';
    $('.iconWrapper span').click(function(e) {
        var kleur = $(this).attr('class');
        if ($('#div1').attr('src') == roz) {
            $('#div1').children('img').remove();
            $('#div1').append('<img src="img/300.jpg" />');
        } else {
            $('#div1').children('img').remove();
            $('#div1').append('<img src="img/106.jpg" />');
        }
        e.preventDefault();
        alert($('#div1').html());
    });
});

answered Jun 19, 2011 at 9:18

thecodeparadox

87.2k22 gold badges143 silver badges164 bronze badges

Collectives™ on Stack Overflow

jQuery if statement problem

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

4 Answers 4

Comments

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related