Question

<div class="select-dropdown-icon"
	ng-mousedown="onDropdownBtnMousedown()"></div>

<div class="select-dropdown" ng-click="onDropdownClick($event)"
	style="display: block;">
	<div class="select-contents-container ng-isolate-scope"
		kt-scrollpane="" on-infinite-scroll="onInfiniteScroll()"
		ng-transclude="">
		<kt-select-option value="off_duty" class="ng-scope ng-isolate-scope">
			<div class="select-option-container select-option-highlighted"
				ng-mouseenter="onMouseenter()" ng-click="onClick()"
				ng-class="{'select-option-highlighted': option.highlighted,'select-option-selected': option.selected,'select-option-hidden': !option.visible,'select-option-new': option.newValue}"
				ng-transclude="" style="">
				<span class="ng-scope">Off Duty</span>
			</div>
		</kt-select-option>
		<kt-select-option value="sleeper" class="ng-scope ng-isolate-scope">
			<div class="select-option-container select-option-selected"
				ng-mouseenter="onMouseenter()" ng-click="onClick()"
				ng-class="{'select-option-highlighted': option.highlighted,'select-option-selected': option.selected,'select-option-hidden': !option.visible,'select-option-new': option.newValue}"
				ng-transclude="">
				<span class="ng-scope">Sleeper</span>
			</div>
		</kt-select-option>
		<!-- ngIf: !logSuggestions.log.isEldEnabled -->
		<kt-select-option value="driving"
			ng-if="!logSuggestions.log.isEldEnabled"
			class="ng-scope ng-isolate-scope">
			<div class="select-option-container" ng-mouseenter="onMouseenter()"
				ng-click="onClick()"
				ng-class="{'select-option-highlighted': option.highlighted,'select-option-selected': option.selected,'select-option-hidden': !option.visible,'select-option-new': option.newValue}"
				ng-transclude="" style="">
				<span class="ng-scope">Driving</span>
			</div>
		</kt-select-option>
		<!-- end ngIf: !logSuggestions.log.isEldEnabled -->
		<kt-select-option value="on_duty" class="ng-scope ng-isolate-scope">
			<div class="select-option-container" ng-mouseenter="onMouseenter()"
				ng-click="onClick()"
				ng-class="{'select-option-highlighted': option.highlighted,'select-option-selected': option.selected,'select-option-hidden': !option.visible,'select-option-new': option.newValue}"
				ng-transclude="" style="">
				<span class="ng-scope">On Duty</span>
			</div>
		</kt-select-option>
	</div>
</div>

请检查代码并告诉我如何访问下拉菜单并选择一个元素。要素“值班”“卧铺”“下班”

Answer 1

如果您熟悉HTML，您会知道传统上使用Select标记实现了下拉列表。 Selenium WebDriver提供了一个Class来处理这样的select。

Select select = new Select(driver.findElement(By.id("select")))

但是，使用jQuery Bootstrap和其他技术开发的较新网站使用spans，divs，li和其他标记以不同方式实现这一点。您的代码也是以这种方式开发的。所以我们必须遵循以下方法。通常，下拉和下拉值位于DOM的不同部分。我们必须通过检查页面源来正确识别它。

单击下拉框并等待下拉值显示

WebElement dropDown = driver.findElement(By.className("select-dropdown-icon"));
dropDown.click();

单击选择所需的下拉值。

WebElement dropDownValueOffDuty  = driver.findElement(By.xpath("//kt-select-option[@value='off_duty']/div"));
dropDownValueOffDuty.click();

我希望这会对你有所帮助。

如何使用带有java的selenium web驱动程序从下拉菜单中选择元素？

1 个答案: