用按钮单击更改div不起作用

Question

我有一段html/css，我需要用js按钮改变div样式，这样我的div就可以显示和点击。我似乎把每件事都做对了，但由于某种原因，它不起作用。

当我点击那个按钮时，什么都不会发生，有人能帮忙吗？

<button type="button" id="letsgo" onclick="letitGo()">Process</button>
<div id="textualdiv">blah blah blah</div>

下面的剧本：

<script>
function letitGo()
{
    document.getElementById("textualdiv").style.opacity="1";
    document.getElementById("textualdiv").style.pointer-events="auto";
}
</script>

和div样式在单独的CSS文件中：

#textualdiv {
    z-index:10;
    background-color:white;
    margin-bottom:0%;
    width:70%;
    text-align:center;
    height:50%;
    min-width:500px;
    top: 10%;
    display: block;
    margin: 0 auto !important;
    padding:0;
    position:relative;
    opacity:0;
    pointer-events: none;
    border-style:solid;
    -webkit-border-radius: 4px;
    -moz-border-radius: 4px;
    border-radius: 4px;
}

Answer 1

CSS pointer-events属性是JavaScript中的elem.style.pointerEvents。

用这个代替

function letitGo()
{
document.getElementById("textualdiv").style.opacity="1";
document.getElementById("textualdiv").style.pointerEvents="auto";
}

JSFiddle - http://jsfiddle.net/dbxcsv9h/

Answer 2

没错就像埃利泽在我面前回应你一样。正确的答案是：

function letitGo()
{
document.getElementById("textualdiv").style.opacity="1";
document.getElementById("textualdiv").style.pointerEvents="auto";
}

请记住，当您想要使用Javascript更改CSS属性时，需要使用camelCase键入该属性的名称。

希望它能帮到你！