对于日期时间选择，HTML5有一个如下所示的新控件。
上面的页面可以访问 这里 这里
如果我们看到DateTime Picker控件的DOM，则日期和时间都只有一个输入框。
因此，为了首先处理这种类型的控件，我们将填充日期，而不用分隔符分隔，即一旦完成，我们将通过按“Tab”和“Fill Time”将焦点从一个日期转移到另一个时间。 如果我们需要填写下午2点45分，我们将把它传递给同一个输入框“0245 PM”。
DatePicker的代码如下所示-
import java.util.List;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.Keys;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.chrome.ChromeDriver;
import org.testng.annotations.Test;
public class DateTimePicker {
@Test
public void dateTimePicker() {
System.setProperty("webdriver.chrome.driver", "chromedriver.exe");
WebDriver driver = new ChromeDriver();
driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
driver.get("http://demo.guru99.com/test/");
//Find the date time picker control
WebElement dateBox = driver.findElement(By.xpath("//form//input[@name='bdaytime']"));
//Fill date as mm/dd/yyyy as 09/25/2013
dateBox.sendKeys("09252013");
//Press tab to shift focus to time field
dateBox.sendKeys(Keys.TAB);
//Fill time as 02:45 PM
dateBox.sendKeys("0245PM");
}
}
输出将如下所示-
让我们看另一个日历示例。可以访问 这里
在这里，如果我们需要更改月份，我们必须单击日历标题的中间。
同样，如果我们需要更改年份，可以通过单击日期选择器上的下一个或上一个链接来完成。
最后，对于更改时间，我们可以从下拉列表中选择正确的时间(注意：这里的时间是在30分钟的间隔中选择的。即12：00、12：30、1：00、1：30等)。
完整的示例如下所示-
import java.util.Calendar;
import java.util.List;
import java.util.concurrent.TimeUnit;
import org.openqa.selenium.By;
import org.openqa.selenium.WebDriver;
import org.openqa.selenium.WebElement;
import org.openqa.selenium.firefox.FirefoxDriver;
import org.testng.annotations.Test;
public class DatePicker {
@Test
public void testDAtePicker() throws Exception{
//DAte and Time to be set in textbox
String dateTime ="12/07/2014 2:00 PM";
WebDriver driver = new FirefoxDriver();
driver.manage().window().maximize();
driver.get("https://demos.telerik.com/kendo-ui/datetimepicker/index");
driver.manage().timeouts().implicitlyWait(10, TimeUnit.SECONDS);
//button to open calendar
WebElement selectDate = driver.findElement(By.xpath("//span[@aria-controls='datetimepicker_dateview']"));
selectDate.click();
//button to move next in calendar
WebElement nextLink = driver.findElement(By.xpath("//div[@id='datetimepicker_dateview']//div[@class='k-header']//a[contains(@class,'k-nav-next')]"));
//button to click in center of calendar header
WebElement midLink = driver.findElement(By.xpath("//div[@id='datetimepicker_dateview']//div[@class='k-header']//a[contains(@class,'k-nav-fast')]"));
//button to move previous month in calendar
WebElement previousLink = driver.findElement(By.xpath("//div[@id='datetimepicker_dateview']//div[@class='k-header']//a[contains(@class,'k-nav-prev')]"));
//Split the date time to get only the date part
String date_dd_MM_yyyy[] = (dateTime.split(" ")[0]).split("/");
//get the year difference between current year and year to set in calander
int yearDiff = Integer.parseInt(date_dd_MM_yyyy[2])- Calendar.getInstance().get(Calendar.YEAR);
midLink.click();
if(yearDiff!=0) {
//if you have to move next year
if(yearDiff>0) {
for(int i=0; i< yearDiff; i++) {
System.out.println("Year Diff->"+i);
nextLink.click();
}
}
//if you have to move previous year
else if(yearDiff<0) {
for(int i=0; i< (yearDiff*(-1) ); i++) {
System.out.println("Year Diff->"+i);
previousLink.click();
}
}
}
Thread.sleep(1000) ;
//Get all months from calendar to select correct one
List<WebElement> list_AllMonthToBook = driver.findElements(By.xpath("//div[@id='datetimepicker_dateview']//table//tbody//td[not(contains(@class,'k-other-month'))]"));
list_AllMonthToBook.get(Integer.parseInt(date_dd_MM_yyyy[1])-1) .click();
Thread.sleep(1000) ;
//get all dates from calendar to select correct one
List<WebElement> list_AllDateToBook = driver.findElements(By.xpath("//div[@id='datetimepicker_dateview']//table//tbody//td[not(contains(@class,'k-other-month'))]"));
list_AllDateToBook.get(Integer.parseInt(date_dd_MM_yyyy[0])-1) .click();
///FOR TIME
WebElement selectTime = driver.findElement(By.xpath("//span[@aria-controls='datetimepicker_timeview']"));
//click time picker button
selectTime.click();
//get list of times
List<WebElement> allTime = driver.findElements(By.xpath("//div[@data-role='popup'][contains(@style,'display: block')]//ul//li[@role='option']"));
dateTime = dateTime.split(" ")[1]+" "+dateTime.split(" ")[2];
//select correct time
for (WebElement webElement : allTime) {
if(webElement.getText().equalsIgnoreCase(dateTime)) {
webElement.click();
}
}
}
}
输出将如下所示
