选择 - 选项如何暂停浏览器进行检查

Question

我有一个由 select - 选项创建的下拉菜单。样本是这里

我需要检查这个下拉菜单来做一些客户风格。 我可以通过下面的代码暂停 Chrome，但是当我移动鼠标时，下拉菜单消失了！

我想知道是否有一些方法可以暂停屏幕然后检查选择选项下拉菜单。

setTimeout(function(){debugger;}, 5000)

Answer 1

我相信您无法检查下拉选项，即使它打开，您也只能检查选择。

在下拉框打开时访问检查模式。打开开发工具，单击下拉菜单，然后使用快捷方式进入检查模式（对于 chrome，为 Ctrl+Shift+C）。

Answer 2

我不太确定在调试时是否可以保持下拉列表打开。也许您对这个解决方法感到满意：

var debugSelect = document.getElementById('debugSelect');

setTimeout(function() {
  debugSelect.size = debugSelect.length;
  debugSelect.multiple = true;
  debugger;
  debugSelect.multiple = false;
  debugSelect.size = 1;
}, 5000);

<select id="debugSelect">
  <option value="">Select an option...</option>
  <option value="1">Option 1</option>
  <option value="2" selected="selected">Option 2</option>
  <option value="3">Option 3</option>
  <option value="4">Option 4</option>
</select>

Answer 3

我相信你可以在这里找到解决方案

总结：只需检查父元素并删除“模糊”和“鼠标移出”事件侦听器

Answer 4

右键单击下拉列表并选择检查元素 按 CTRL+SHIFT+p 类型焦点 选择模拟聚焦页面 单击下拉菜单，然后单击要检查的特定元素，当尝试之前检查时，这些元素会消失

希望这有帮助