hello. so to keep it short and simple. I have a button "Cloned" and an <img>. The problem is that the image gets double cloned on the second, third and so on when Cloned button is clicked. Like on the first click image gets cloned and displayed once, on the second click 2 of the image gets displayed instead of one which would now equal to having 3 of the image. On the third click 4 of the image is cloned instead of 1 so now i have alot of the images on just 3 clicks. it is my cloning jquery that is creating this mess and not sure how to fix it.

    <script type="text/javascript">
        $(document).ready(function(){
            $(".8r").hide();
            $(".8s").live("click", function(){
                var R8seats = $(".8r").clone();
                var element = $(".arrangement-main");
                element.append(R8seats);
                R8seats.show();
            });
        });
    </script>
    <input type="button" class="8s" value="Cloned">
    <img src="img/8r.jpg" width="400" height="200" class="8r">

im using jquery to hide the img because display:none hides it thoroughly and doesn't show it when append. arrangement-main is just an empty div to place the img. yes, im using an old version of js 1.8, will upgrade soon.

Recommended Answers

Try changing line 5

var R8seats = $(".8r").clone();

to

var R8seats = $(".8r:first").clone();

Otherwise you are cloning all images with a class of 8r.

Jump to Post

All 2 Replies

Try changing line 5

var R8seats = $(".8r").clone();

to

var R8seats = $(".8r:first").clone();

Otherwise you are cloning all images with a class of 8r.

oh right.. didn't think about that. thank you!

Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts learning and sharing knowledge.