javascript - 单击复选框时隐藏元素

单击复选框时，我试图隐藏元素。
不知怎的它不起作用-
html格式

<input type="checkbox"  onchange="showAtidit()">
<p id="hidethis">
hide me
</p>

js公司

function showAtidit($)
{
    if ($(this).is(':checked'))
    {
        alert("not hide");
        document.getElementById( "hidethis" ).style.display = 'block';
    }
    else
    {
        alert("hide");
        document.getElementById( "hidethis" ).style.display = 'none';
    }
};

http://jsfiddle.net/wv97mpcp/108/
发生了什么？
谢谢！

最佳答案

因为您使用的是jquery，所以只需使用toggle()：

function showAtidit()
{
   $('#hidethis').toggle();
}

希望这有帮助。

function showAtidit()
{
  $('#hidethis').toggle();
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox"  onchange="showAtidit()">
<p id="hidethis">
hide me
</p>