Question

页面中有很多图像，我有以下php代码，其中图像的id是动态生成的

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

现在，我必须在双击时逐个调整这些图像的大小。代码如下：

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

使用上面的代码，如果计数是2，那么它显示警告两次但是调整一个，即第一个，而另一个没有调整大小。

Answer 1

你可以尝试这样的东西（你需要jQuery）

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

这将仅定位您点击的元素。您不需要遍历所有元素，dblclick是一个事件，只有在您使用它时才会处理

Answer 2

这就是我提出的：

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

Here is the JSFiddle demo

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

2 个答案: