2

使用 HTML 5、CSS、JavaScript 和 JQuery 创建 Web 应用程序。

我使用了新的 Date() 函数来生成今天的日期。我还使用了 JQuery 的“datepicker”函数来允许用户选择他们的 DOB。这些都工作得很好。

我想要的是在选择 DOB 时计算年龄。我已经包含了一个计算年龄的函数,它依赖于日期和出生日期,但不能让它将数字返回到屏幕上。这可以在下面看到。

<tr>
    <td>Age:</td>
    <!--td><input type="text" id="age" /></td-->
    <td> 
            <script type = "text/javascript">
        var date = document.getElementById("adDate").value
        var dob = document.getElementById("datepicker").value
        var pattern = /^\d{1,2}\/\d{1,2}\/\d{4}$/
        if (pattern. test(dob)) {
            var currentYear = date.getFullYear()
            var birthYear = date.getFullYear()
            var age = currentYear - birthYear
            document.write(age)
        } 
        </script>
    <td>
</tr>

我在网上搜索了解决方案,但只是得到了基本的 JavaScript 年龄计算。任何帮助将非常感激。

非常感谢。

我试图应用一些更改,但无济于事。我已经更新了如下所示的 JS。

var date = document.getElementById("adDate").value
var dob = document.getElementById("datepicker").value
var pattern = /^\d{1,2}\/\d{1,2}\/\d{4}$/
if (pattern. test(dob)) {
    var currentYear = new Date(date).getFullYear()
    var birthYear = new Date(dob).getFullYear()
    var age = currentYear - birthYear

    var spanAge = document.getElementById("age")
    spanAge.innerHTML = age
} 

还有HTML。

<tr>
    <td>Age:</td>
    <td><span id="age"></span></td>
</tr>

它必须与使用日期选择器生成 DOB 有关。我尝试应用 onSelect 函数,但似乎没有任何效果。

还有什么建议吗?

4

3 回答 3

0

您应该确保创建了一个有效的 Date 对象,您可以将 UI 元素中的值传递给它:

var currentYear = new Date().getFullYear()            
var birthYear = new Date('5/6/1987').getFullYear()             
var age = currentYear - birthYear             
于 2013-01-28T22:22:03.467 回答
0

修复您的代码:

var currentYear = new Date(date).getFullYear()
var birthYear = new Date(dob).getFullYear()

恢复表格单元格:

<td><span id="age"></span></td>

而且,而不是 document.write 使用这个:

// document.write(age) // Remove this line.
var spanAge = document.getElementById("age")
spanAge.innerHTML = age

这里有一个模拟:

http://jsfiddle.net/dEaae/1/

于 2013-01-28T22:22:58.007 回答
-2

您应该选择一个 html 元素来显示结果

前任:

            <div id = "printHere"></div>

             <tr>
<td>Age:</td>
<!--td><input type="text" id="age" /></td-->
<td> 
        <script type = "text/javascript">
         //assuming you have "age" here

          //using jquery
          $("#printHere").html(age);
    } 
    </script>
<td>

于 2013-01-28T22:22:01.607 回答