Question

你好我想隐藏列表样式当我点击身体的任何地方。在默认情况下代码隐藏，当我点击按钮时它会显示一个列表。但是当我点击任何地方时它无法隐藏。谁能告诉我我该怎么做？

.dss {
        background: #FFF;
        color: #0086EE;
        display: none;
        padding: 25px;
        position: absolute;
        top: 10px;
        z-index: 10;
        -moz-box-shadow: rgba(0,0,0,0.45) 0 0 9px;
        -webkit-box-shadow: rgba(0,0,0,0.45) 0 0 9px;
        box-shadow: rgba(0,0,0,0.45) 0 0 9px;
    }

另见js代码： -

function show() {
        document.getElementById("demo").style.display = "block";
    }


Also see the html:-

<input type="submit" value="select services" onclick="show()" style="border: none; background: transparent; width: 95px;" />
        <!--<select onFocus="show()" style="background: #FFF;border: none; display:none;cursor: pointer;height: 33px;left: 0;opacity: 0;position: absolute;top: 10px;width: 8%;">
    <option>a</option>
  </select>-->
        <div class="dss" id="demo">
            <ul style="list-style: none;">
                <li><a href="#">a</a></li>
                <li><a href="#">b</a></li>
                <li><a href="#">c</a></li>
                <li><a href="#">d</a></li>
            </ul>
        </div>

Answer 1

我假设你有问题，你想在点击按钮时隐藏下拉列表。

 document.getElementById("ButtonID").onclick=function()
 {
   document.getElementById("DropdownID").style.display='none'; // Thanks for the correction
 }

如果您还有其他问题，请添加您的选择下拉列表

如果要通过单击正文中的任意位置来隐藏它，请替换该buttonID单击。

所以你的javascript函数问题。您应首先单击书面正文，然后单击显示ul。

的按钮

  document.getElementsByTagName("body")[0].onclick = function(){//Hide UL}

  document.getElementById("ButtonID").onclick = fucntion(//show UL){}

Answer 2

function show()
{
 document.getElementById("demo").style.display="block";
}

$(function(){
    $('#demo').click(function(event){ event.stopPropagation(); });
    $('input[type=submit]').click(function(event){  show(); event.stopPropagation(); });
    $('html').click(function(){
       $('#demo').hide();
    })
});

点击隐藏列表样式

2 个答案: