1

我有一个这样的html

<div class="div1">
<div class="cross">
</div>

<div class="contnt">

<input type="button" onclick="submitdata()"/>
</div>

div1 有类似的 css

.div1 {
padding: 35px 11px 15px;
margin-bottom: -12px;
border: 0px none;
}

和 div 交叉有

.cross{
width: 511px;
height: 100%;
background: url(../images/cross01.png) repeat-y;
position: absolute;
top: 0px;
right: 5px;
z-index: 1000;
background-repeat: no-repeat;
background-size: 100% 100%;
}

和 div 内容有

.contnt{    
position: relative;
    height: 299px;
    width: 267px;
}

问题是我无法单击 div contnt 中的按钮。超链接、按钮和 div contnt 中的任何内容都不起作用。任何人都知道问题是什么。有什么建议吗？

4

2 回答 2

6

z-index:1000on是把.cross它放在你的按钮前面。这适用于点击和渲染。

于 2013-06-03T08:30:08.830 回答
1

首先，您需要一个.crossdiv 的结束标签：

<div class="div1">
    <div class="cross"></div>
</div>

<div class="contnt">
    <input type="button" onclick="submitdata()"/>
</div>

此外，由于 div 上的 z-index 1000，您的按钮被 .cross div 遮挡.cross。您将需要：

  • 将点击事件绑定到十字架，或
  • 将按钮从十字下方移到可以单击的位置。

    • 您可以使用这样的 javascript 片段将事件绑定到十字架：

    var cross = document.getElementsByClassName('cross'); 
cross[0].onclick = submitdata;
    于 2013-06-03T08:32:31.267 回答