使用jquery在动态创建的文本框中添加数字

Question

我有下表循环三次。

<c:forEach items="${timesheet.dailyProjectDetails}" var="dailyProjectDetails" varStatus="status">
    <tr>
        <td>
            <button type="button" class="delete_project">Delete</button>
        </td>
        <td>
            <select name="dailyProjectDetails[${status.index}].TIM_Emp_Project_Id" id="dailyProjectDetails[${status.index}].TIM_Emp_Project_Id">
                <c:forEach var="project" items="${projectList}">
                    <option>${project}</option>
                </c:forEach>
            </select>
        </td>
        <td>
            <select name="dailyProjectDetails[${status.index}].TIM_Emp_Job_Id" id="dailyProjectDetails[${status.index}].TIM_Emp_Job_Id">
                <c:forEach var="task" items="${taskList}">
                    <option>${task}</option>
                </c:forEach>
            </select>
        </td>
        <td>
            <input name="dailyProjectDetails[${status.index}].TIM_Hrs" id="txt_${status.index}" class="hours" placeholder="Hours" onkeypress="return event.charCode >= 48 && event.charCode <= 57">
        </td>
        <td>
            <input name="dailyProjectDetails[${status.index}].TIM_Desc" placeholder="Notes">
        </td>                   
    </tr>
</c:forEach>

然后这些动态创建的表行循环四次。这些行是通过单击按钮创建的，按钮保留在表格之外。

$(document).ready(function() {
    var counter = 3;
    var project_row = 0;
    var leave_row = 0;

    $("#add_project").click(function() {
        if (project_row == 4) {
            alert( "Only 7 rows allowed" );
            return false;
        }

        var new_project_row = $(document.createElement('tr'));
        new_project_row.after().html('<td><button type="button" class="delete_project">Delete</button></td>' + 
            '<td><select><c:forEach var="project" items="${projectList}"><option>${project}</option></c:forEach></select></td>' +
            '<td><select><c:forEach var="task" items="${taskList}"><option>${task}</option></c:forEach></select></td>' +
            '<td><input type="text" placeholder="Hours" value = "" id = "txt4_' + counter + '" class="hours" onkeypress="return event.charCode >= 48 && event.charCode <= 57"></td>' +
            '<td><input type="text" placeholder="Notes"></td>' );                           

        new_project_row.appendTo("#project_table");
        counter++;
        project_row++;
    });     

现在，我想使用jQuery添加用户在此输入框中输入的值。

<input name="dailyProjectDetails[${status.index}].TIM_Hrs" id="txt_${status.index}" class="hours" placeholder="Hours" onkeypress="return event.charCode >= 48 && event.charCode <= 57">

而且，我想在此输入框中显示实时和结果，该输入框位于表格之外。

Total Hours <form:input type="text" id="total_hours" value="" path=""/>

请帮我解决这个问题。提前谢谢。