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

【问题标题】：Select - Option How to Pause browser to Inspect选择 - 选项如何暂停浏览器进行检查
【发布时间】：2018-02-07 22:36:49
【问题描述】：

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

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

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

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

【问题讨论】：

我遇到了同样的问题，this 为我工作。

标签： html css debugging pause

【解决方案1】：

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

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>

【讨论】：

【解决方案2】：

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

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

【讨论】：