dongpu9852
2015-08-05 06:43
浏览 122

使用jquery调整动态生成id的html对象

There are many images in the page and I have the following php code in which the id of the images are generated dynamically

echo '<input type="hidden" value='.$count.'';
    for($i = 1; $i <= $count; $i++) {
        echo '<input type="image" src= "image.png" id=img'.($i).'';
    }

Now, I have to resize these images one by one when they are double clicked. The code for that is as below

$function(){
    var c= document.getElementById('count').value;
    for(i = 1; i <= c; i++) {
        $('#V' + i).dblclick( function() {
            alert("Proceed with resizing");
            $('#V' + i).resizable();
        }
    });

With the above code,if the count is say 2 then it is showing alert twice but resizing one i.e the first one and the other one is not getting resized.

  • 点赞
  • 写回答
  • 关注问题
  • 收藏
  • 邀请回答

2条回答 默认 最新

  • dousao6313 2015-08-05 06:55
    已采纳

    You can try something like this (you need jQuery for it)

    $( 'input[type=image]' ).dblclick(function() {
        alert("Proceed with resizing");
        $(this).resizable();
    });
    

    This will target only element you are clicking on. You don't need to loop over all elements, the dblclick is an event, that is handled only when you are using it

    点赞 打赏 评论
  • dropbox1111 2015-08-05 06:56

    This is what I came up with:

    $(document).on('dblclick', "input[type='image']", function(){
         //alert('abc');  
        $(this).resizable();
    });
    

    Here is the JSFiddle demo

    点赞 打赏 评论

相关推荐 更多相似问题