Question

我有一个元素设置为在css中显示：none。单击父元素后，将显示选择 document.getElementById（'selectId'）。style.display ='block'; 现在我希望在选择某个选项后，选择器会消失。当从onchange调用style.display ='none'时，它会闪烁几分之一秒并再次可见。我甚至用console.log（obj.style.display）检查过，确实显示变化很快。我怎样才能实现这种行为：onchange显示='none'？纯JavsScript或JQuery无关紧要编辑：它看起来像＆lt; select＆gt;上的onchange事件触发父级的onclick，将显示重置为“block”。代码和解决方案：根据@AndyG的建议，我修改了onchange事件调用的函数，如下所示： function selChanged（obj）{ $（OBJ）。点击（函数（事件）{ event.stopPropagation（）; }）; obj.style.display ='block'; } 现在它不再触发父母'onclick'了。这里是html代码：＆lt; td onclick =“showSelect（selId）”＆gt; ＆lt; select id =“selId”onchange =“selChanged（this）”＆gt; ＆LT;选项＆GT; .... ＆LT; /选项＆GT; ＆LT; / TD＆GT;

Answer 1

如果通过单击选项更改了选择，则此单击事件将冒泡到父元素，从而导致选择重新出现。

更改事件中的

event.stopPropagation();将阻止此冒泡到父级。

Answer 2

Whit jQuery ..

$('#selectId').hide()隐藏它

$('#selectId').show()显示

Answer 3

试试这个：

$(function() {
    $('select').on('change', function() {
        $(this).hide();
    });
});

如何通过onchange隐藏<select>元素

3 个答案: