Question

我使用以下代码隐藏div，如果在div外部点击。但我在该div中有一个表单，其中有一个输入类型file.so当我选择一个文件时，该框消失，因为它在外面点击div。

$(document).mouseup(function (e){
    var container = $("body #new_discuss_form");
    if (!container.is(e.target) // if the target of the click isn't the container...
        && container.has(e.target).length === 0) // ... nor a descendant of the container
    {

        container.hide();
    }
});

Answer 1

将id="fileInput"分配给您的输入类型文件并使用以下代码：

$(document).mouseup(function (e){
var container = $("body #new_discuss_form");
if (!container.is(e.target) // if the target of the click isn't the container...
    && container.has(e.target).length === 0 // ... nor a descendant of the container
    && e.target.id!="fileInput")// if not input file
{

    container.hide();
}

Answer 2

您可以使用以下功能来实现这一目标。

function hideDivOutsideClick( clickedElem ){

     var divElemId  = '#new_discuss_form';
     var divElem    = $(divElemId);
     var parentElem = $(clickedElem).closest(divElemId);

     if(parentElem.length == 0 ){  //clicked element is not inside the div
          divElem.hide();
     }
}

$(document).mouseup(function (event){
     var clickedElem = $(event.target);
     hideDivOutsideClick(clickedElem);
});

选择文件时div隐藏

2 个答案: