如何在动态下拉列表中选择元素?

时间:2013-09-27 14:15:21

标签: java selenium webdriver

我正在用Java编写selenium测试,我无法从下拉列表中选择服务器(例如“CORAL”)。

这是html:

  <div id="listBoxjqxWidgetHostPortCombo" style="overflow: hidden; background-color: transparent; border: medium none; position: absolute; display: none; width: 355px; height: 307px; left: 12px; top: 64px;">
<div id="innerListBoxjqxWidgetHostPortCombo" class="jqx-listbox jqx-listbox-sandbox jqx-reset jqx-reset-sandbox jqx-rc-all jqx-rc-all-sandbox jqx-widget jqx-widget-sandbox jqx-widget-content jqx-widget-content-sandbox jqx-disableselect jqx-popup jqx-popup-sandbox" style="width: 330px; height: 282px; position: absolute; z-index: 2147483647; top: 0px; left: 0px; margin-top: 0px; opacity: 1;" aria-multiselectable="false" role="listbox">
<div style="-webkit-appearance: none; background: transparent; outline: none; width:100%; height: 100%; align:left; border: 0px; padding: 0px; margin: 0px; left: 0px; top: 0px; valign:top; position: relative;">
<div style="-webkit-appearance: none; border: none; background: transparent; outline: none; width:100%; height: 100%; padding: 0px; margin: 0px; align:left; left: 0px; top: 0px; valign:top; position: relative;">
<div id="listBoxContentinnerListBoxjqxWidgetHostPortCombo" style="background: none repeat scroll 0% 0% transparent; outline: medium none; border: medium none; padding: 0px; overflow: hidden; margin: 0px; left: 0px; top: 0px; position: absolute; width: 311px; height: 280px;">
<div style="outline: 0px none; overflow: hidden; width: 330px; position: relative; height: 564px;">
<div id="listitem0innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 0px; left: 0px;" aria-selected="true">
<span class="jqx-listitem-state-normal jqx-listitem-state-normal-sandbox jqx-item jqx-item-sandbox jqx-rc-all jqx-rc-all-sandbox jqx-listitem-state-selected jqx-listitem-state-selected-sandbox jqx-fill-state-pressed jqx-fill-state-pressed-sandbox" style="display: block; visibility: inherit; width: 301px;">172.29.45.28</span>
</div>
<div id="listitem1innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 24px; left: 0px;">
<span class="jqx-listitem-state-normal jqx-listitem-state-normal-sandbox jqx-item jqx-item-sandbox jqx-rc-all jqx-rc-all-sandbox" style="display: block; visibility: inherit; width: 301px;">192.168.155.98</span>
</div>
<div id="listitem2innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 48px; left: 0px;">
<span class="jqx-listitem-state-normal jqx-listitem-state-normal-sandbox jqx-item jqx-item-sandbox jqx-rc-all jqx-rc-all-sandbox" style="display: block; visibility: inherit; width: 301px;">192.168.203.165</span>
</div>
<div id="listitem3innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 72px; left: 0px;">
<span class="jqx-listitem-state-normal jqx-listitem-state-normal-sandbox jqx-item jqx-item-sandbox jqx-rc-all jqx-rc-all-sandbox" style="display: block; visibility: inherit; width: 301px;">192.168.203.21</span>
</div>
<div id="listitem4innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 96px; left: 0px;">
<span class="jqx-listitem-state-normal jqx-listitem-state-normal-sandbox jqx-item jqx-item-sandbox jqx-rc-all jqx-rc-all-sandbox" style="display: block; visibility: inherit; width: 301px;">192.168.99.94</span>
</div>
<div id="listitem5innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 120px; left: 0px;">
<span class="jqx-listitem-state-normal jqx-listitem-state-normal-sandbox jqx-item jqx-item-sandbox jqx-rc-all jqx-rc-all-sandbox" style="display: block; visibility: inherit; width: 301px;">Alexey</span>
</div>
<div id="listitem6innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 144px; left: 0px;">
<span class="jqx-listitem-state-normal jqx-listitem-state-normal-sandbox jqx-item jqx-item-sandbox jqx-rc-all jqx-rc-all-sandbox" style="display: block; visibility: inherit; width: 301px;">Anton</span>
</div>
<div id="listitem7innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 168px; left: 0px;">
<span class="jqx-listitem-state-normal jqx-listitem-state-normal-sandbox jqx-item jqx-item-sandbox jqx-rc-all jqx-rc-all-sandbox" style="display: block; visibility: inherit; width: 301px;">Anton origin issue env</span>
</div>
<div id="listitem8innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 192px; left: 0px;">
<span class="jqx-listitem-state-normal jqx-listitem-state-normal-sandbox jqx-item jqx-item-sandbox jqx-rc-all jqx-rc-all-sandbox" style="display: block; visibility: inherit; width: 301px;">CORAL</span>
</div>
<div id="listitem9innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 216px; left: 0px;">
<div id="listitem10innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 240px; left: 0px;">
<div id="listitem11innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 576px; left: 0px;">
<span class="" style="display: block; visibility: hidden; width: 301px;">PD POWER POKER</span>
</div>
<div id="listitem12innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 600px; left: 0px;">
<span class="" style="display: block; visibility: hidden; width: 301px;">PROD Ray</span>
</div>
<div id="listitem13innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 624px; left: 0px;">
<span class="" style="display: block; visibility: hidden; width: 301px;">PT INTEGR</span>
</div>
<div id="listitem14innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 648px; left: 0px;">
<span class="" style="display: block; visibility: hidden; width: 301px;">Perfomance</span>
</div>
<div id="listitem15innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 672px; left: 0px;">
<span class="" style="display: block; visibility: hidden; width: 301px;">Piazza demo</span>
</div>
<div id="listitem16innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 696px;">
<span class="" style="visibility: hidden;"></span>
</div>
<div id="listitem17innerListBoxjqxWidgetHostPortCombo" class="jqx-listitem-element" role="option" style="height: 24px; top: 720px;">
<span class="" style="visibility: hidden;"></span>
</div>
<div id="verticalScrollBarinnerListBoxjqxWidgetHostPortCombo" class="jqx-scrollbar jqx-scrollbar-sandbox jqx-widget jqx-widget-sandbox jqx-widget-content jqx-widget-content-sandbox jqx-rc-all jqx-rc-all-sandbox" style="visibility: inherit; left: 311px; top: 0px; position: absolute; width: 15px; height: 280px;">
<div id="horizontalScrollBarinnerListBoxjqxWidgetHostPortCombo" class="jqx-scrollbar jqx-scrollbar-sandbox jqx-widget jqx-widget-sandbox jqx-widget-content jqx-widget-content-sandbox jqx-rc-all jqx-rc-all-sandbox" style="visibility: hidden; left: 0px; top: 263px; position: absolute; height: 15px; width: 311px;">
<div id="bottomRightinnerListBoxjqxWidgetHostPortCombo" class="jqx-listbox-bottomright jqx-listbox-bottomright-sandbox" style="left: 312px; top: 659px; border: medium none; position: absolute; visibility: hidden; width: 18px; height: 18px;"></div>
</div>
</div>
</div>
</div>

PS:首先我们需要激活下拉列表,因为它是隐藏的。

1 个答案:

答案 0 :(得分:2)

首先,点击它打开下拉列表。我不知道哪个元素可以做到这一点,但你应该能够做到这一点。

选择/点击CORAL:

driver.findElement(By.cssSelector("#listitem8innerListBoxjqxWidgetHostPortCombo span")).click();

如果您不知道如何编写选择器,Stackoverflow不是要求其他人为您编写它们的地方。请了解可以与By一起使用的不同选择器。我特别建议花时间学习CSS。