Javascript 如何在jquery中禁用单击事件

我已经使用ajax发布在jQueryPHP中实现了文件上传拖放

Im使用id为upload_btn的html输入文件标记和id为total的div拖放文件

以删除屏幕上的浏览按钮并将div total用作浏览文件。我在$document.readyfunction顶部添加了这两行{

在divtotal中删除所选文件后，列出此处的所有文件。如果任何所选文件超过最大文件大小，我将为每个文件显示“删除”按钮以从列表中删除该文件。但单击“删除”后，所选文件删除成功，但正如我再次编写上述两条语句时，浏览事件为ca在这种情况下，我如何禁用浏览

显示id为total的div标记中的所有文件，如下所示：

 $(upfiles).each(function(index, file) 
                    {
                        if(total_size > limit) // size limit comparision
                             display_removebutton = "<img width='20px' style='cursor:pointer;' height='20px' class='class_remove' id='remove_"+int_loop+"' src='images/DeleteRed.png' />"
                        size = Math.round( file.size / 1024 );
                        if(size > 1024) 
                                size_display =  Math.round(size / 1024 * 100)/100 + ' mb'; // converted to mb
                        else
                                size_display = size + ' kb';
                        if(size > limit)
                        {
                            style_limitexceed = "style='background:#FFCCCC;border-radius:17px;height:30px;margin-top:6px;'";
                        }
                        else
                        {
                            style_limitexceed = "";
                        }
                        $('#total').append("<div id='div_selec"+int_loop+"' "+style_limitexceed+"><b>File Name :</b> "+file.name + "<b> Size:</b>" + size_display + display_removebutton + "</div>"+"" ); 
                        $("#remove_"+int_loop).click(function() {
                        if(confirm( "Do you want to delete file : "+ file.name+ "?" ) === true)
                        {

// here we need to remove the click event for **fileupload input tag**
                                var curr_id = this.id;
                                var id = curr_id.substr(7);
                                $("#div_selec"+id).empty();
                                upfiles.splice(index, 1)
                                $("#div_selec"+id).fadeOut('slow');
                                total_size = total_size - (file.size/1024);
                                if(total_size < limit)
                                {
                                    $("#total img:last-child").remove()
                                    $("#div_errorLog").fadeOut('slow');
                                }
                        }
                         });
                         int_loop++;
                    });

希望你们能理解我的问题…等待你们的建议

编辑：

确切需要的是，当total div有一些内容时，则浏览事件不应归档，当单击remove display\u removebutton甚至total div时：stopPropagation

：防止违约

您可以通过以下方式停止单击事件：

event.stopPropagation();

或

event.stopPropagation方法停止将事件冒泡到父元素，从而阻止执行任何父事件处理程序

在你的代码中

document.getElementById('total').addEventListener('click',function(event){
  event.preventDefault();
  document.getElementById('fileToUpload').click();

});

除了防止执行元素上的任何其他处理程序外，此方法还通过隐式调用event.stopPropagation来停止冒泡。为了简单地防止事件冒泡到祖先元素，但允许其他事件处理程序在同一元素上执行，我们可以改为使用event.stopPropagation

使用event.isimmediatePropagationsToping了解是否曾经对该事件对象调用过此方法

使用event.stopImmediatePropagation；或event.stopRoPagation停止单击事件

$('document').ready(function(){
       document.getElementById('total').addEventListener('click',function(event){
      document.getElementById('fileToUpload').click();
      event.stopImmediatePropagation(); (or) event.stopPropagation()
    });
  });

---

如果您使用preventDefault，这将产生相同的效果。请您稍作解释。我必须在哪里使用您的编解码器？请您给出生成的最终dom结构？您是说当您单击delete按钮时，total click被触发了吗？不。这个过程是在我第一次单击div total时进行的eToUpload click事件应该发生。在将文件拖动到total div中后，如果文件大小增加了最大大小限制，则会出现display_removebutton按钮，现在当我单击display_removebutton时，不会发生fileToUpload事件。这意味着display_removebutton div位于total div中。我说的对吗？？？是的，这就是问题所在。要解决此问题，请执行以下操作：单击total div时，向total div添加一个类，并将该类命名为active。然后将代码更改为-document.getElementById'total'。addEventListener'click'，函数{if！$this.hasClassactive{document.getElementById'fileToUpload'。click；}

document.getElementById('total').addEventListener('click',function(event){
  event.preventDefault();
  document.getElementById('fileToUpload').click();

});

$('document').ready(function(){
       document.getElementById('total').addEventListener('click',function(event){
      document.getElementById('fileToUpload').click();
      event.stopImmediatePropagation(); (or) event.stopPropagation()
    });
  });

$("yourClass").click(function(e){
    e.preventDefault();
});

$(upfiles).each(function(index, file) 
                {
                    if(total_size > limit) // size limit comparision
                         display_removebutton = "<img width='20px' style='cursor:pointer;' height='20px' class='class_remove' id='remove_"+int_loop+"' src='images/DeleteRed.png' />"
                    size = Math.round( file.size / 1024 );
                    if(size > 1024) 
                            size_display =  Math.round(size / 1024 * 100)/100 + ' mb';     // converted to mb
                    else
                            size_display = size + ' kb';
                    if(size > limit)
                    {
                        style_limitexceed = "style='background:#FFCCCC;border-radius:17px;height:30px;margin-top:6px;'";
                    }
                    else
                    {
                        style_limitexceed = "";
                    }
                    $('#total').append("<div id='div_selec"+int_loop+"' "+style_limitexceed+"><b>File Name :</b> "+file.name + "<b> Size:</b>" + size_display + display_removebutton + "</div>"+"" ); 
                    $("#remove_"+int_loop).click(function(e) {
                    e.preventDefault();
                    if(confirm( "Do you want to delete file : "+ file.name+ "?" ) === true)
                    {

// here we need to remove the click event for **fileupload input tag**
                            var curr_id = this.id;
                            var id = curr_id.substr(7);
                            $("#div_selec"+id).empty();
                            upfiles.splice(index, 1)
                            $("#div_selec"+id).fadeOut('slow');
                            total_size = total_size - (file.size/1024);
                            if(total_size < limit)
                            {
                                $("#total img:last-child").remove()
                                $("#div_errorLog").fadeOut('slow');
                            }
                    }
                     });
                     int_loop++;
                });