0

我有一个 php 脚本，它生成开始时间和结束时间之间的时间列表，增量为 15 分钟。在 HTML 方面，我有两个用于开始和结束时间的选择下拉列表，并且我为两个选择下拉列表加载了相同的 php 脚本。我将列表注入到 DOM 的 innerHTML 中，然后使用 jQuery 将结束时间设置为列表中的最后一个值。

我可以在 HTML 源代码中看到选择了结束时间的最后一个值，但在选择下拉列表中，我只看到结束时间的第一个值。如何更新/刷新选择下拉菜单以显示实际选择的值？

function addEmployee() {
        var num = 1;
        var fields= html("employees").innerHTML;
        num += html("employees").getElementsByTagName('a').length;
        if(num <= 14) {
            fields+="<div id=\"employee_line"+num+"\">";
            fields+="<label for=\"employeeName"+num+"\">Employee: <select name=\"employeeName"+num+"\"><?php echo $opts; ?></select></label> ";
            if(scheduler.templates.event_date(new Date(html("start_date").value)) == "07:00") {
                fields+="<label for=\"employeeTimeStart"+num+"\">Start Time: <select name=\"employeeTimeStart"+num+"\"><?php echo $time_morning; ?></select></label> ";
                fields+="<label for=\"employeeTimeEnd"+num+"\">End Time: <select name=\"employeeTimeEnd"+num+"\"><?php echo $time_morning; ?></select></label> ";
            } else if(scheduler.templates.event_date(new Date(html("start_date").value)) == "12:00") {
                fields+="<label for=\"employeeTimeStart"+num+"\">Start Time: <select name=\"employeeTimeStart"+num+"\"><?php echo $time_afternoon; ?></select></label> ";
                fields+="<label for=\"employeeTimeEnd"+num+"\">End Time: <select name=\"employeeTimeEnd"+num+"\"><?php echo $time_afternoon; ?></select></label> ";
            } else if(scheduler.templates.event_date(new Date(html("start_date").value)) == "17:00") {
                fields+="<label for=\"employeeTimeStart"+num+"\">Start Time: <select name=\"employeeTimeStart"+num+"\"><?php echo $time_evening; ?></select></label> ";
                fields+="<label for=\"employeeTimeEnd"+num+"\">End Time: <select name=\"employeeTimeEnd"+num+"\"><?php echo $time_evening; ?></select></label> ";
            }
            fields+="<a href=\"#\" onclick=\"delete_employee("+num+")\">del</a>";
            fields+="<br /></div>";
            document.getElementById("employees").innerHTML = fields;
            $('select[name^="employeeTimeStart' + html("employees").getElementsByTagName('a').length + '"]').children('option').each(function(index, obj) {
                var date = new Date(html("start_date").value.toString("r"));
                if(scheduler.templates.event_date(date) == $(obj).val()) {
                    $(obj).attr("selected", "selected");
                }
            });
            $('select[name^="employeeTimeEnd' + html("employees").getElementsByTagName('a').length + '"]').children('option').each(function(index, obj) {
                var date = new Date(html("end_date").value.toString("r"));
                if($(obj).val() == scheduler.templates.event_date(date)) {
                    $(obj).attr("selected", "selected");
                }
            });
        } else {
            alert("Maximum number of employees reached.");
        }
}
4

2 回答 2

0

您需要使用 .on

$("select").on("change", function(event){
alert($(this).val());
});
于 2013-05-22T14:58:14.553 回答
0

使用 .prop 更改选定的属性。

$(obj).prop("selected", true);

或者你可以改为

$(theselect).val(thevalue);
于 2013-05-22T15:21:37.457 回答