如何在使用jquery单击锚定标记后在同一页面上弹出表单

我希望在单击锚定标记时触发div中表单的代码。 当我单击超链接时，它在控制台中显示：

未捕获的TypeError:$（…）。Dragable不是函数

我不知道我在这个函数中做错了什么

<script>
  $(function() {
    $("showForm").on("click", function() {
      $("#draggable").toggle();
    });
  });
</script>


<div>
  <a href="#" id="showForm"><h3>New Post</h3></a>
</div>


<div id="draggable" class="drag postblock">
  Post No.
  <img src="images/cross.png" alt="X" id="qrClose" class="extButton" title="Close Window">
  <form name="form1" method="post" action="index.php" enctype="multipart/form-data">
  <div>
  <textarea name="post" cols="48" rows="4" wrap="soft" tabindex="0" placeholder="Entry"></textarea>
  </div>
  <div>
  <input type="file" id="qrFile" tabindex="0" size="19" title="Upload file">
  <input type="submit" name="submit" value="Post">
  </div>
  </form>
</div>

$（函数（）{
$（“showForm”）。在（“单击”，函数（）上{
$（“#可拖动”）.toggle（）；
});
});
邮政编码。

1） 对id使用

#

，因此：

更改：

$("showForm").on("click", function(){...})

致：

2） 在html代码上方插入

jquery CDN

3） 使用

$（文档）.ready（函数（）{

完整代码：

$（文档）.ready（函数（）{
$（#showForm”）。在（“单击”，函数（）上{
$（“#可拖动”）.toggle（）；
})
})

邮政编码。

它没有显示表单。当我单击超链接时，我希望它在页面上的某个位置直接显示表单

$("#showForm").on("click", function(){...})