无法使用webdriver选择下拉菜单

Not able to select a dropdown using webdriver

本文关键字：选择 下拉菜单 webdriver      更新时间：2023-09-26

我用的是http://www.makemytrip.com/

下面是Html代码

<div class="mrgnBot30 clearFix">
<span class="watch_icn flL"></span>
<div class="widget_inner clearFix suggest_me padBot15 flL">
<h3 class="clearFix hasBorderBottom">
<p class="clearFix checkDates">
<span class="check_date flL">
<label for="checkInDate">
Check-in Date:&nbsp;
<span id="checkInDate_day" class="dayLight">(Monday)</span>
</label>
<a id="checkInDateControl" class="cal_icn flL" href="#" tabindex="201"></a>
<input id="checkInDate" class="day flL hasDatepicker" type="text"  autocomplete="false"     value="01/21/2013"     name="searchCriteria.criterion.stayDateRanges[0].start" style="display: none;">
<span class="day date flL">
<select class="selectBox" tabindex="202" style="display: none;">
<span class="left_part flL"></span>
<span class="selectBox center_part flL selectBox-dropdown" style="display: inline-block; -moz-user-select: none;" title="" tabindex="202">
<span class="selectBox-label">21</span>
<span class="selectBox-arrow controls flR">
<a class="select_drop_icon flR" onclick="return false;" href="#"></a>
</span>
</span>
<span class="right_part flL"></span>
</span>
<span class="day month flL">
<select class="selectBox" tabindex="203" style="display: none;">
<span class="left_part flL"></span>
<span class="selectBox center_part flL selectBox-dropdown" style="display: inline-block; -moz-user-select: none;" title="" tabindex="203">
<span class="selectBox-label">Jan,13</span>
<span class="selectBox-arrow controls flR">
<a class="select_drop_icon flR" onclick="return false;" href="#"></a>
</span>
</span>
<span class="right_part flL"></span>
</span>
</span>
<span class="check_date last flL">
<span id="nights" class="nights flL">2 Night(s)</span>
</p>
</div>
</div>

这里我有一个下拉选择Check in date和Check out date。坦率地说，我不知道如何从代码中选择下拉菜单的值。此外，我不确定它是否是下拉菜单。为什么我说在硒IDE中记录的同时，它记录为从下拉菜单中选择一个值的click事件。

我尝试select语句通过使用firebug捕获xpath值从下拉菜单中选择一个值。

使用的代码: 

 driver.get("http://www.makemytrip.com/");
 driver.findElement(By.xpath("//li[4]/a/span/span")).click();
    Select sel = new Select(driver.findElement(By
            .xpath("//div[2]/div/p/span/span/span[2]")));
    try {
        sel.selectByValue("21");
    } catch (Exception e) {
        e.printStackTrace();
    }

没有效果。下面是记录后从selenium IDE转换过来的代码。

Selenese代码:

driver.get("http://www.makemytrip.com/");
driver.findElement(By.xpath("//div[@id='chf_navigation']/ul/li[4]/a/span/span")).click();
assertEquals("I want to go to", driver.findElement(By.cssSelector("label")).getText());
assertEquals("Online Hotel Booking for Cheap, Budget & Luxury Hotels in India | MakeMyTrip.com", driver.getTitle());
driver.findElement(By.xpath("(//a[@onclick='return false;'])[2]")).click();
driver.findElement(By.xpath("(//a[@onclick='return false;'])[3]")).click();
driver.findElement(By.xpath("(//a[@onclick='return false;'])[4]")).click();
driver.findElement(By.cssSelector("li.selectBox-hover.selectBox-selected > a")).click();
driver.findElement(By.xpath("(//a[@onclick='return false;'])[5]")).click();

查看下拉菜单的步骤:

  1. 打开http://www.makemytrip.com/
  2. 点击酒店链接
  3. 你可以看到Check in Date下拉列表

请提供有用的建议来解决问题。

您已经给出了html代码，但是您还没有提供您编写的代码，请提供您为这个程序编写的代码，并让我们知道显示的错误信息或异常

Check in date select id为b_checkin_day &&b_checkin_month。下面是如何选择它们

//select the check-in date <select> element
Element el = driver.findElement(By.id('b_checkin_day'));
Select sel = new Select(el)
// go on with selection

查看select id: b_checkout_day &&b_checkout_month

这是美国版的。印度版本肯定不是一个选择，但不符合你的html

编辑:发现你说的是阿联酋航空的网站。

如果要选择日期，您应该使用:

Element el = driver.findElement(By.xpath("//input[@id='checkInDate']/following-sibling::span[contains(@class,'date')]/select"))

路径如下:month checkIn, day Checkout &&月结帐

"//input[@id='checkInDate']/following-sibling::span[contains(@class,'month')]/select"
"//input[@id='checkOutDate']/following-sibling::span[contains(@class,'day')]/select"
"//input[@id='checkOutDate']/following-sibling::span[contains(@class,'month')]/select"

第一个解决方案是使用这些xpath来选择正确的值

您还可以更简单地检查用于填写表单的输入中的正确日期例如，将正确的日期设置为

中的值
<input id="checkInDate" class="day flL hasDatepicker" type="text"  autocomplete="false"     value="01/21/2013"     name="searchCriteria.criterion.stayDateRanges[0].start" style="display: none;">

就可以了。(注意value="01/21/2013")

EDIT2:

您是否尝试过对访问者使用的实际元素这样做?首先，单击下拉箭头("//input[@id='checkInDate']/following-sibling::span[contains(@class,'date')]/")，它将使javascript日期选择器使用的选择可见。然后你应该能够做出正确的选择时，点击://ul[contains(@class,'selectBox-dropdown') and contains(@style,'block')]//a[@rel="25"]

如果25是你想要的日子。用于进行选择的<ul>s/<li>s位于页面的底部。查看它们，您将找到正确的xpath

相关文章：