Question

我的问题是我想最初隐藏我的删除按钮，就像用户在复选框上标记时一样删除按钮一直显示，直到所有复选框都没有标记为

这就是我尝试这样做的方式，当我取消标记一个复选框时我遇到的问题我的删除按钮消失但我的其余复选框已标记

    <%@page import="java.util.List"%>
<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<%@page
    import="com.nousinfo.tutorial.employee.service.model.bo.EmployeeBO"%>

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<link rel="stylesheet" href="css/style.css" type="text/css"></link>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">


<title>Home</title>

<script type="text/javascript">
    function windowLoadByName(windowHeight, windowWidth) {
        var centerWidth = (window.screen.width - windowWidth) / 2;
        var centerHeight = (window.screen.height - windowHeight) / 2;

        newWindow = window.open(
                'PopUp.jsp',
                'mywindow',
                'resizable=0,width=' + windowWidth + ',height=' + windowHeight
                        + ',left=' + centerWidth + ',top=' + centerHeight,
                "status=1").divHiding(1);
        newWindow.focus();

    }
    function windowLoadById(windowHeight, windowWidth) {
        var centerWidth = (window.screen.width - windowWidth) / 2;
        var centerHeight = (window.screen.height - windowHeight) / 2;
        newWindow = window.open(
                'PopUp.jsp',
                'mywindow',
                'resizable=0,width=' + windowWidth + ',height=' + windowHeight
                        + ',left=' + centerWidth + ',top=' + centerHeight)
                .divHiding(2);

        newWindow.focus();
        return newWindow.name;
    }

    function loadName(name) {

        this.firstName = name;
        window.location = 'http://localhost:8080/EmployeeWeb/GetEmployee?key1='
                + encodeURIComponent(firstName);

    }
    function loadId(id) {

        this.id = id;

        window.location = 'http://localhost:8080/EmployeeWeb/GetEmployee?key2='
                + encodeURIComponent(id);

    }

    function showMe (it, box) { 
      var vis = (box.checked) ? "block" : "none"; 
      document.getElementById(it).style.display = vis;
    } 


</script>

</head>

<body background="transparent">


    <table width="951" height="116" border="0" align="center">
        <tr>
            <td width="661" height="112" bgcolor="#D1D1FF"><font size="6">EmployeeManagement</font>
            </td>
            <td width="266" height="112" align="center" bgcolor="#FFFFFF"><img
                src="image/nous.jpg" alt="1" width="266" height="84" /></td>
        </tr>
    </table>
    <p>&nbsp;</p>


    <table width="949" height="183" border="0" align="center">
        <tr>
            <td height="42" align="center" bgcolor="#3366FF"><strong>Find
                    Employee </strong></td>
        </tr>

        <tr>
            <td width="943" height="43"><input id="findid" name="button"
                type="submit" value="Find_Employee_By_ID"
                onClick="windowLoadById(250,500)" /></td>
        </tr>
        <tr>

            <td height="43"><input id="findname" name="submit2"
                type="button" value="Find_Employee_By_Name"
                onClick="windowLoadByName(250,500)" /></td>
        </tr>
        <tr>
            <td><form id="form2" action="GetEmployee">
                    <input type="submit" name="submit3" value="Get_All_Employee" />
                </form></td>
        </tr>
        <tr>
            <td><form id="form2" action="CreateEmployee.jsp">
                    <input type="submit" name="create" value="CreateEmployee" />
                </form></td>
        </tr>


    </table>

    <p>&nbsp;</p>
    <br>
    <br>
    <div id="div12">
        <form action="UpdateEmployeeServlet">
            <table width="725" border="1" align="center" cellpadding="5"
                cellspacing="5">
                <tr>
                    <th width="118">check</th>
                    <th width="118">EmployeeNumber</th>
                    <th width="118">First Name</th>
                    <th width="118">Last Name</th>
                    <th width="118">Title</th>
                    <th width="118">Address1</th>
                    <th width="118">Address2</th>
                    <th width="118">City</th>
                    <th width="118">Detail
                    <th>
                </tr>
                <c:forEach var="employeeBO" items="${listemployeeBo}">
                    <tr>
                        <td><input type="checkbox" value='${employeeBO.empNumber}'
                            name="checked" onclick="showMe('div1',this)"></td>
                        <td>${employeeBO.empNumber}</td>

                        <td>${employeeBO.firstName}</td>

                        <td>${employeeBO.lastName}</td>

                        <td>${employeeBO.title}</td>

                        <td>${employeeBO.address1}</td>

                        <td>${employeeBO.address2}</td>

                        <td>${employeeBO.city}</td>



                        <td><a href="javascript:loadId(${employeeBO.empNumber})">Details</a></td>

                    </tr>
                </c:forEach>

            </table>
            <div id="div1" style="display:none;">
                <table>

                    <tr>

                        <td><input type="hidden" name="updateStatusDelete" value="D" />
                            <input type="submit" name="delete" value="Delete" /></td>
                    </tr>
                </table>
            </div>
        </form>
    </div>
</body>
</html>

Answer 1

将showMe功能替换为：

// box is not needed now, it checks all checkboxes to see
// if any one of them is checked
function showMe(it, box) {
    var hasChecked = false;
    var chks = document.getElementsByName('checked');
    var vis = '';

    for ( var i = 0; i < chks.length; i++ ) {
        if ( chks[ i ].checked ) {
            hasChecked = true;
            break;
        }
    }

    if ( hasChecked == false ) {
        vis = "none";
    } else {
        vis = "block";
    }

    document.getElementById( it ).style.display = vis;
}

希望它有所帮助。

继续显示一个div标签，直到所有复选框都没有标记为gmail

1 个答案: