Question

我正在开发一个网站，我在其中创建了一个使用plupload脚本上传多个图像的选项。这使我们可以在点击图像上传多个图像时触发弹出窗口。

此脚本需要添加一个JS文件，该文件的代码如下所示：

$(document).ready(function(){
var baseurl = $('#baseurl').val();
var i = 0;
$('.uploadFiles_one').click(function(){

   $('#uploadBox_one').dialog('open');
    return false
})
....
..some more js code..
....
})

现在我修改了这个JS文件，这样我就可以使用相同的JS文件来处理我通过PHP循环生成的多个DOM元素，新脚本的代码如下：

$( document ).on( "click", ".uploadFiles_loop", function(){
var baseurl = $('#baseurl').val();
var i = 0;
var my_id = $(this).attr('id');
var cnt = my_id.replace("anchor_", "");

$('.uploadFiles_loop').click(function(){

   $('#uploadBox_'+cnt).dialog('open');
    return false;
});
....
..some more js code..
....
})

当用户点击图像时，前端将有一个图像，它将打开一个弹出窗口。但是现在当我修改脚本时，我必须在图像上单击两次才能获得弹出窗口。但在此之后，所有其余的图片上传器图标只需单击即可打开。

所以我的问题是为什么我必须第一次点击任何“上传图片”两次（我的意思是页面加载时）。

Answer 1

尝试删除此额外点击处理程序$('.uploadFiles_loop').click(function(){ ... });

离开：

$( document ).on( "click", ".uploadFiles_loop", function(){
    var baseurl = $('#baseurl').val();
    var i = 0;
    var my_id = $(this).attr('id');
    var cnt = my_id.replace("anchor_", "");
    $('#uploadBox_'+cnt).dialog('open');
    // Recheck were you want this return false;
    return false; 
....
..some more js code..
....
})

在您的代码上，您有一个侦听器，在单击时运行一个添加了单击侦听器的函数。因此，只有通过第二次单击它才会运行代码$('#uploadBox_'+cnt).dialog('open'); return false;。如果删除它将在第一次单击时运行。

P.S。 - 在你的代码中你有一个return false;，如果你有更多的代码，它将无效。所以我评论过它，你可能想要在你剩下的代码之后得到它。

Answer 2

$(document).ready(function(){
    $( document ).on( "click", ".uploadFiles_loop", function(){
        var baseurl = $('#baseurl').val();
        var i = 0;
        var my_id = $(this).attr('id');
        var cnt = my_id.replace("anchor_", "");

        $('#uploadBox_'+cnt).dialog('open');
        return false;


    });
    ....
    ..some more js code..
    ....
});

非常不清楚你想要实际完成什么，但是，当你在on函数中直接点击时，你需要执行你想要的动作。不要将其包装在另一个点击功能

中

我不想点击两次来触发事件

2 个答案: