元素当前不可见,不能操作
本文关键字:不能 操作 元素 | 更新日期: 2023-09-27 17:49:16
我正在使用Chrome浏览器的硒,我坚持从下拉菜单中选择一个值。我可以从网页本身获得的标记:
<div class="col-sm-8 select-month no-margin-bottom no-padding-left form-group select-container">
<select class="selectarea form-control select-month bs-select-hidden" id="month_start" name="month_start" title="Bitte wählen">
<option class="bs-title-option" value="">Bitte wählen</option>
<option id="month_start1" value="1">Januar</option>
<option id="month_start2" value="2">Februar</option>
<option id="month_start3" value="3">März</option>
<option id="month_start4" value="4">April</option>
<option id="month_start5" value="5">Mai</option>
<option id="month_start6" value="6">Juni</option>
<option id="month_start7" value="7" selected="selected">Juli</option>
<option id="month_start8" value="8">August</option>
<option id="month_start9" value="9">September</option>
<option id="month_start10" value="10">Oktober</option>
<option id="month_start11" value="11">November</option>
<option id="month_start12" value="12">Dezember</option>
</select>
<div class="btn-group bootstrap-select selectarea form-control select-month open">
<button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" data-id="month_start" title="Juli" aria-expanded="true">
<span class="filter-option pull-left">Juli</span>
<span class="bs-caret"><span class="caret"></span>
</span>
</button>
<div class="dropdown-menu open" style="max-height: 489.688px; overflow: hidden; min-height: 64px;">
<ul class="dropdown-menu inner" role="menu" style="max-height: 487.688px; overflow-y: auto; min-height: 62px;">
<li data-original-index="1"><a tabindex="0" class="" style="" data-tokens="null">
<span class="text">Januar</span>
<span class="glyphicon glyphicon-ok check-mark"></span>
</a></li><li data-original-index="2"><a tabindex="0" class="" style="" data-tokens="null">
<span class="text">Februar</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="3"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">März</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="4"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">April</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="5"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Mai</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="6"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Juni</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="7" class="selected"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Juli</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="8"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">August</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="9"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">September</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="10"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Oktober</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="11"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">November</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="12"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">Dezember</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div></div></div>
<div class="col-sm-8 select-year do_not_break_visible_hint no-margin-bottom no-padding-left form-group select-container"><select class="selectarea form-control select-year bs-select-hidden" id="year_start" name="year_start" title="Bitte wählen" style=""><option class="bs-title-option" value="">Bitte wählen</option>
<option id="year_start2016" value="2016" selected="selected">2016</option><option id="year_start2017" value="2017">2017</option><option id="year_start2018" value="2018">2018</option><option id="year_start2019" value="2019">2019</option><option id="year_start2020" value="2020">2020</option><option id="year_start2021" value="2021">2021</option><option id="year_start2022" value="2022">2022</option><option id="year_start2023" value="2023">2023</option><option id="year_start2024" value="2024">2024</option><option id="year_start2025" value="2025">2025</option><option id="year_start2026" value="2026">2026</option><option id="year_start2027" value="2027">2027</option><option id="year_start2028" value="2028">2028</option><option id="year_start2029" value="2029">2029</option><option id="year_start2030" value="2030">2030</option><option id="year_start2031" value="2031">2031</option><option id="year_start2032" value="2032">2032</option><option id="year_start2033" value="2033">2033</option><option id="year_start2034" value="2034">2034</option><option id="year_start2035" value="2035">2035</option><option id="year_start2036" value="2036">2036</option>
</select><div class="btn-group bootstrap-select selectarea form-control select-year"><button type="button" class="btn dropdown-toggle btn-default" data-toggle="dropdown" data-id="year_start" title="2016"><span class="filter-option pull-left">2016</span> <span class="bs-caret"><span class="caret"></span></span></button><div class="dropdown-menu open"><ul class="dropdown-menu inner" role="menu"><li data-original-index="1" class="selected"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2016</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="2"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2017</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="3"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2018</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="4"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2019</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="5"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2020</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="6"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2021</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="7"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2022</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="8"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2023</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="9"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2024</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="10"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2025</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="11"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2026</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="12"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2027</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="13"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2028</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="14"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2029</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="15"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2030</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="16"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2031</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="17"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2032</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="18"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2033</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="19"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2034</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="20"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2035</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li><li data-original-index="21"><a tabindex="0" class="" style="" data-tokens="null"><span class="text">2036</span><span class="glyphicon glyphicon-ok check-mark"></span></a></li></ul></div></div></div>
<div class="clearfix"></div>
</div>
</div>
我使用下面的代码来选择值:
new SelectElement(chromeDriver.FindElement(By.Id("month_start"))).SelectByText("Dezember");
但是,它说下面的
元素当前不可见,不能操作
这使我得出结论,HTML标记(option class=bs-title-option
)的第一部分不是正确的。无论如何,如何处理这个??
应用程序中真正的下拉菜单是由bootstrap库生成的。您必须点击按钮并从下拉菜单中的列表中选择项目。请看下面的例子:
var wait = new WebDriverWait(driver, TimeSpan.FromSeconds(10));
wait.Until(d => !d.FindElement(By.Id("busy")).Displayed);
// Click first month
driver.FindElement(By.CssSelector(".bootstrap-select.select-month > button")).Click();
System.Threading.Thread.Sleep(1000);
string targetMonth = "Februar";
driver.FindElement(By.XPath("//span[contains(text(),'" + targetMonth + "')]/..").Click();
// Click project type
System.Threading.Thread.Sleep(1000);
driver.FindElement(By.CssSelector("button[data-id='projecttype']")).Click();
System.Threading.Thread.Sleep(1000);
string targetType = "In-house project";
driver.FindElement(By.XPath("//span[contains(.,'" + targetType + "')]/..").Click();