天天看点

1、下拉框的触发事件。2、点击事件在本下拉框新增一个下拉框。

一、这里面包含οnchange="changeEvent(this)"和οnclick="addEmployeeLabelFunc();"两个事件。

<tr>
            <th width="30%"><b>*</b>员工标签:</th>
            <td width="20%">
                <select id="employeeLabelId" name="employeeInfo.employeeLabelId" onchange="changeEvent(this)">
                    <option value="">请选择</option>
                    #foreach($employeeLabel in $employeeLabelList)
                        <option value="$employeeLabel.labelId" #if($employeeInfo.employeeLabelId==$employeeLabel.labelId)
                                selected #end >$employeeLabel.name</option>
                    #end
                </select>
            </td>
            <td width="10%">
                <button type="button" onclick="addEmployeeLabelFunc();">添加标签</button>
            </td>
            <td id="recommendPerson" width="30%">
            </td>
        </tr>
        <tr id="selectEmployeeLabel"></tr>
        <tr id="tomorrowStar"></tr>
           

1、οnchange="changeEvent(this)"的作用是当选中的下拉项id=$!tomorrowStar.labelId时候,出现一个“选择推荐人”按钮。

function changeEvent(obj) {
            if (obj.value == '$!tomorrowStar.labelId') {
                var tomorrow = '$!tomorrowStar.labelId'.value;
               $(obj).parent("td").parent("tr").find("#recommendPerson").append("        " +
                        "<td id=\"entryType\">\n" +
                        "        <input value=\"选择推荐人\" style=\"width: 70px\" type=\"button\" class=\"small-width-btn\" οnclick=\"Employee.selectEmployee(this)\">\n" +
                        "</td>\n" +
                        "        <td>\n" +
                        "            \n" +
                        "            <input type=\"text\" style=\"width: 55px\" name=\"recommendEmployeeName\" id=\"recommendEmployeeName\" value=\"\" readonly>\n" +
                        "            <input type=\"hidden\" name=\"recommendEmployeeId\" id=\"recommendEmployeeId\" value=\"\">\n" +
                        "        </td>");
            } else {
                $(obj).parent("td").parent("tr").find("#recommendPerson").empty();
            }
        }
           

2、οnclick="addEmployeeLabelFunc();"的作用是点击这个按钮,在id=“selectEmployeeLabel”前面弹出一个相同的下拉框。

function addEmployeeLabelFunc() {
            $("#selectEmployeeLabel").before("<tr>\n" +
                    "       <th width=\"30%\"><b>*</b>员工标签:</th>\n" +
                    "       <td width=\"20%\">\n" +
                    "               <select id=\"employeeLabelId\" name=\"employeeInfo.employeeLabelId\" οnchange=\"changeEvent(this)\">\n" +
                    "               <option value=\"\">请选择</option>\n" +
                    "       #foreach($employeeLabel in $employeeLabelList)\n" +
                        "               <option value=\"$employeeLabel.labelId\" #if($employeeInfo.employeeLabelId==$employeeLabel.labelId)\n" +
                            "       selected #end >$employeeLabel.name</option>\n" +
                        "       #end\n" +
                    "  </select>\n" +
                    "             </td>)\n" +
                    "       <td width=\"20%\">\n" +
                    "       <button type=\"button\" οnclick=\"deleteLabel(this);\">删除标签</button>\n" +
                    "            </td>)\n" +
                    "<td id=\"recommendPerson\"></td>" +
                    "        </tr>");
        }