Selenium处理自定义下拉框：UL显示瞬间消失无法获取LI元素求助

我碰到过好多次这种下拉框刚显示就立刻隐藏的情况，大概率是页面绑定了mouseout或者其他触发隐藏的事件，或是你的脚本执行时机不对，导致下拉框还没稳定就被页面逻辑给藏起来了。咱们一步步来修复：

先修正你代码里的明显错误 #

你写的JavaScript执行语句有语法问题，而且设置样式的方式不够稳妥：

// 原来的错误代码
((IJavaScriptExecutor)driver).ExecuteScript("arguments[0].style='display: block;', elementToShow);
// 修正后：
((IJavaScriptExecutor)driver).ExecuteScript("arguments[0].style.display = 'block'; arguments[0].style.visibility = 'visible';", elementToShow);

另外，你定位LI元素用的是绝对XPath，会从整个页面查找匹配项，应该改成相对路径，只在当前UL元素下查找：

// 原来的绝对路径
IWebElement option = elementToShow.FindElement(By.XPath("//li/span[contains(text(),'" + filterOption + "')]"));
// 改成相对路径
IWebElement option = elementToShow.FindElement(By.XPath(".//li/span[contains(text(),'" + filterOption + "')]"));

方案一：直接用JavaScript点击目标选项（最稳妥的绕过方式） #

既然下拉框显示后立刻消失，那咱们不用去触发显示下拉框的交互，直接通过JS找到目标LI元素并模拟点击，完全绕开下拉框显示隐藏的问题：

public void SelectFilter(string filterOption)
{
    // 直接定位到目标LI元素的父节点并触发点击
    string jsScript = $"document.querySelector('ul#parentFilter li span[data-title=\"{filterOption}\"]').parentElement.click();";
    ((IJavaScriptExecutor)driver).ExecuteScript(jsScript);
}

这种方式不需要处理下拉框的显示状态，直接调用页面原生的点击事件，和用户手动点击效果一致。

方案二：修复交互逻辑，加上显式等待确保元素稳定 #

如果一定要模拟用户的点击流程，那需要确保下拉框显示后，等待LI元素可见再操作，同时可能需要阻止导致下拉框隐藏的事件：

using OpenQA.Selenium.Support.UI;
using OpenQA.Selenium;

private IWebElement parentFilter => driver.FindElement(By.XPath("//div[@id='main_filter']/span"));
private WebDriverWait wait;

// 假设这是你的类构造函数
public YourPageClass(IWebDriver driver)
{
    this.driver = driver;
    wait = new WebDriverWait(driver, TimeSpan.FromSeconds(10));
}

public void SelectFilter(string filterOption)
{
    // 点击span触发下拉框显示，同时用JS强制保持UL显示并移除隐藏事件
    parentFilter.Click();
    IWebElement elementToShow = wait.Until(d => d.FindElement(By.Id("parentFilter")));
    ((IJavaScriptExecutor)driver).ExecuteScript(@"
        arguments[0].style.display = 'block';
        arguments[0].style.visibility = 'visible';
        arguments[0].onmouseleave = null; // 移除mouseleave触发隐藏的事件
    ", elementToShow);

    // 等待目标选项可见后点击
    IWebElement option = wait.Until(d => elementToShow.FindElement(By.XPath($".//li/span[contains(text(),'{filterOption}')]")));
    option.Click();
}

这里用WebDriverWait做显式等待，确保元素加载完成后再操作，同时移除了可能导致下拉框隐藏的mouseleave事件，避免刚显示就被藏起来。

方案三：模拟鼠标停留确保下拉框不消失 #

如果页面的隐藏逻辑是鼠标离开下拉框区域才触发，那可以用Actions类让鼠标停留在下拉框区域：

public void SelectFilter(string filterOption)
{
    Actions action = new Actions(driver);
    // 点击span后立刻将鼠标移动到UL元素上，防止隐藏
    action.Click(parentFilter)
          .MoveToElement(driver.FindElement(By.Id("parentFilter")))
          .Build()
          .Perform();

    // 等待选项可见后点击
    WebDriverWait wait = new WebDriverWait(driver, TimeSpan.FromSeconds(10));
    IWebElement option = wait.Until(d => d.FindElement(By.XPath($"//ul[@id='parentFilter']/li/span[contains(text(),'{filterOption}')]")));
    option.Click();
}

试一下这些方案，应该能解决你遇到的UL显示瞬间消失的问题。

内容的提问来源于stack exchange，提问作者Kalyani Thosar