Question

通过单击图像“imgAdd”，我想通过使用JavaScript将div“divAddCustomerInfo”的可见性设置为true。但点击图片不起作用。我认为这是因为JavaScript不起作用。有人可以帮忙吗？ Yhanks提前。

<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" runat="server">
 <script type="text/javascript">
    function imgAdd_click() {
        document.getElementById("divAddCustomerInfo").style.visibility = 'visible';
    }
</script>
<div id="divCustomerBody" style="margin-left:300px; margin-top:50px;">
    <h1>Customer</h1>
    <hr style="color:gray; width:900px; margin-left: 0px;" />
    <br />
    <div id="divOperationSymbol" style="height:100px; width:900px; ">

        <div id="divAddition" onclick="divAddition_click()" style="height:100px; float:left; width:300px; " >
            <img id="imgAdd" onclick="imgAdd_click()" src="001446-3d-transparent-glass-icon-media-a-media35-add.png" style="height:70px; width:70px; display:block; margin-left:auto; margin-right:auto;" />
            <label id="lblAdd" onclick="lblADD_click()" style="color: #a6a6a6; margin-left:100px;">Add Customer</label>
        </div>

    </div>
</div>
    <div id="divAddCustomerInfo" style="visibility: hidden; margin-left:300px; margin-top:50px;">

</div>

Answer 1

更改以下

<div id="divAddCustomerInfo" runat="server" visible="false" style="margin-left:300px; margin-top:50px;">

<强>向

<div id="divAddCustomerInfo" runat="server" style="visibility:hidden;margin-left:300px; margin-top:50px;">

Answer 2

将以下部分更新为

<div id="divAddition" onclick="divAddition_click()" style="height:100px; float:left; width:300px; " >
            <img id="imgAdd" onclick="imgAdd_click()" src="001446-3d-transparent-glass-icon-media-a-media35-add.png" style="height:70px; width:70px; display:block; margin-left:auto; margin-right:auto;" />
            <label id="lblAdd" onclick="lblADD_click()" style="color: #a6a6a6; margin-left:100px;">Add Customer</label>
        </div>

Answer 3

它是您的代码的工作版本（见下文）：你的错误：

onclick
visibility: hidden;

div id="divAddCustomerInfo"

<div id="divCustomerBody" style="margin-left:300px; margin-top:50px;">
    <h1>Customer</h1>
    <hr style="color:gray; width:900px; margin-left: 0px;" />
    <br />
    <div id="divOperationSymbol" style="height:100px; width:900px; ">

        <div id="divAddition" onclick="divAddition_click()" style="height:100px; float:left; width:300px; " >
            <img id="imgAdd" onclick="imgAdd_click()" src="http://www.ipac.caltech.edu/2mass/gallery/antennae.jpg" style="height:70px; width:70px; display:block; margin-left:auto; margin-right:auto;" />
            <label id="lblAdd" onclick="lblADD_click()" style="color: #a6a6a6; margin-left:100px;">Add Customer</label>
        </div>

    </div>
</div>
<div id="divAddCustomerInfo" runat="server"   style="margin-left:300px; margin-top:50px; visibility:hidden">
    Text
</div>

function imgAdd_click() {
    document.getElementById("divAddCustomerInfo").style.visibility = 'visible';
}

java脚本在内容页面中不起作用

3 个答案: