通过两个下拉列表（即时间和持续时间）的组合显示预期时间

Question

我是Java语言的新手，需要您的帮助。我有两个下拉菜单，分别是时间和持续时间，通过这些下拉菜单，我需要在javascript中显示计算出的时间。

假设我从ddlValidityFrom选择11:00 AM，从ddlValidityTo选择3.00，那么lblExpectedOutTime应该显示2:00 PM。

请帮助！

<label id="lblValidityFrom">Enter Validity Period From<span class="RedFieldsANR">*</span></label>
<asp:DropDownList ID="ddlValidityFrom" runat="server" CssClass="inputDDLTime">
    <asp:ListItem Value="0" Text="Select Time"></asp:ListItem>
    <asp:ListItem Text="06:00 AM"></asp:ListItem>
    <asp:ListItem Text="06:30 AM"></asp:ListItem>
    <asp:ListItem Text="07:00 AM"></asp:ListItem>
    <asp:ListItem Text="07:30 AM"></asp:ListItem>
    <asp:ListItem Text="08:00 AM"></asp:ListItem>
    <asp:ListItem Text="08:30 AM"></asp:ListItem>
    <asp:ListItem Text="09:00 AM"></asp:ListItem>
    <asp:ListItem Text="09:30 AM"></asp:ListItem>
    <asp:ListItem Text="10:00 AM"></asp:ListItem>
    <asp:ListItem Text="10:30 AM"></asp:ListItem>
    <asp:ListItem Text="11:00 AM"></asp:ListItem>
    <asp:ListItem Text="11:30 AM"></asp:ListItem>
    <asp:ListItem Text="12:00 PM"></asp:ListItem>
    <asp:ListItem Text="12:30 PM"></asp:ListItem>
    <asp:ListItem Text="01:00 PM"></asp:ListItem>
    <asp:ListItem Text="01:30 PM"></asp:ListItem>
    <asp:ListItem Text="02:00 PM"></asp:ListItem>
    <asp:ListItem Text="02:30 PM"></asp:ListItem>
    <asp:ListItem Text="03:00 PM"></asp:ListItem>
    <asp:ListItem Text="03:30 PM"></asp:ListItem>
    <asp:ListItem Text="04:00 PM"></asp:ListItem>
    <asp:ListItem Text="04:30 PM"></asp:ListItem>
    <asp:ListItem Text="05:00 PM"></asp:ListItem>
    <asp:ListItem Text="05:30 PM"></asp:ListItem>
    <asp:ListItem Text="06:00 PM"></asp:ListItem>
</asp:DropDownList>

<span id="lblValidityTo" class="spBox fl">Validity Period</span>
<asp:DropDownList ID="ddlValidityTo" runat="server" CssClass="inputDDLTimeHrs" onchange="calculateExpectedHours()">

    <asp:ListItem Text="0.30"></asp:ListItem>
    <asp:ListItem Text="1.00"></asp:ListItem>
    <asp:ListItem Text="1.30"></asp:ListItem>
    <asp:ListItem Text="2.00" Selected="True"></asp:ListItem>
    <asp:ListItem Text="2.30"></asp:ListItem>
    <asp:ListItem Text="3.00"></asp:ListItem>
    <asp:ListItem Text="3.30"></asp:ListItem>
    <asp:ListItem Text="4.00"></asp:ListItem>
    <asp:ListItem Text="4.30"></asp:ListItem>
    <asp:ListItem Text="5.00"></asp:ListItem>
    <asp:ListItem Text="5.30"></asp:ListItem>
    <asp:ListItem Text="6.00"></asp:ListItem>
    <asp:ListItem Text="6.30"></asp:ListItem>
    <asp:ListItem Text="7.00"></asp:ListItem>
    <asp:ListItem Text="7.30"></asp:ListItem>
    <asp:ListItem Text="8.00"></asp:ListItem>
    <asp:ListItem Text="8.30"></asp:ListItem>
    <asp:ListItem Text="9.00"></asp:ListItem>
</asp:DropDownList>
<span id="lblHrs" class="sp_Box fl">Hrs.</span>
<asp:RequiredFieldValidator ID="rfvValidityFrom" EnableClientScript="true" runat="server" ControlToValidate="ddlValidityFrom" InitialValue="0"
    ErrorMessage="Required" ValidationGroup="valSponsoredVisitor" CssClass="RedReqFieldsValidityFrom"></asp:RequiredFieldValidator>
</p>
<p>
<label id="lblExpectedOutTimeText">Expected Out Time</label>
<label id="lblExpectedOutTime"></label>
</p>