HTML/Javascript在单击事件时打印表单

我的HTML文件中有这个脚本

<script type="text/javascript">
    $(document).ready(function addTeacher() {
        $("#addTeacher").click(function addTeacher() {
            $('#conteudo').html("FORM CODE HERE");
        });
    }); 
</script>

$（文档）.ready（函数addTeacher（）{
$（“#addTeacher”）。单击（函数addTeacher（）{
$（'#conteudo'）.html（“此处的表单代码”）；
});
}); 

---

我想要打印在div#addTeacher上的表格：

<form  method="post" action="auth.php" role="form">

    <div class="form-group">
        <input type="text" name="login" id="login" class="form-control" placeholder="Login">
    </div>

    <div class="form-group">
        <input type="password" name="senha" id="senha" class="form-control" placeholder="Senha">
    </div>

    <input type="submit" value="Login" class="btn btn-success" />

</form>

我将表单代码粘贴在引号之间，但当我单击按钮时，什么也没有发生。我做错了什么

div代码：

<div class="container" id="conteudo">
  <div class="row">
  </div>
</div>

按钮：

 <button type="button" id="addTeachers" class="btn btn-primary">Adicionar Professor</button> 

Adicionar教授

---

首先，确保为按钮引用了正确的ID

addTeachers

与

addTeacher

不同

第二，确保你的引号正确，避免换行。任何一个错误都会导致语法错误

---

这里有一个工作示例：

在这里，您还可以使用javascript执行此操作：

<script type="text/javascript">
    var add = function(){

        var parent = document.getElementById("row");

    var form1 = document.createElement("form");
        form1.setAttribute("method","post");
        form1.setAttribute("action","auth.php");
        form1.setAttribute("role","form");

    var form_groupe = document.createElement("div");
        form_groupe.setAttribute("class","form-groupe");

    var form_groupe2 = document.createElement("div");
        form_groupe.setAttribute("class","form-groupe");



    var login = document.createElement("input");
        login.setAttribute("type","text");
        login.setAttribute("name","login");
        login.setAttribute("id","login");
        login.setAttribute("class","form-controll");
        login.setAttribute("placeholder","login");

    var pass = document.createElement("input");
        pass.setAttribute("type","password");
        pass.setAttribute("name","senha");
        pass.setAttribute("id","senha");
        pass.setAttribute("class","form-controll");
        pass.setAttribute("placeholder","Senha");   

    var submit = document.createElement("input");   
        submit.setAttribute("type","submit");
        submit.setAttribute("name","login");
        submit.setAttribute("class","btn btn-success");

    form_groupe.appendChild(login);
    form_groupe2.appendChild(pass); 
    form1.appendChild(form_groupe);
    form1.appendChild(form_groupe2);    
    form1.appendChild(submit);  
    parent.appendChild(form1);  
};
</script> 

<div class="container" id="conteudo">
  <div class="row" id="row">
  </div>
</div>
 <button type="button" id="addTeachers" class="btn btn-primary" onclick="add();">Adicionar Professor</button> 

var add=函数（）{
var parent=document.getElementById（“行”）；
var form1=document.createElement（“表单”）；
表格1.设置属性（“方法”、“职位”）；
form1.setAttribute（“action”、“auth.php”）；
form1.setAttribute（“角色”、“形式”）；
var form_groupe=document.createElement（“div”）；
form_groupe.setAttribute（“类”、“form groupe”）；
var form_groupe2=document.createElement（“div”）；
form_groupe.setAttribute（“类”、“form groupe”）；
var login=document.createElement（“输入”）；
login.setAttribute（“类型”、“文本”）；
setAttribute（“名称”、“登录名”）；
setAttribute（“id”，“login”）；
setAttribute（“类”、“窗体控件”）；
setAttribute（“占位符”、“登录”）；
var pass=document.createElement（“输入”）；
pass.setAttribute（“类型”、“密码”）；
pass.setAttribute（“名称”、“senha”）；
pass.setAttribute（“id”、“senha”）；
pass.setAttribute（“类”、“窗体控件”）；
setAttribute（“占位符”、“Senha”）；
var submit=document.createElement（“输入”）；
submit.setAttribute（“类型”、“提交”）；
submit.setAttribute（“名称”、“登录”）；
submit.setAttribute（“类”，“btn btn成功”）；
表单_groupe.appendChild（登录）；
表格2.附加子项（通过）；
表格1.附属儿童（表格组E）；
表格1.附属儿童（表格2）；
表格1.附件（提交）；
父母、子女（表格一）；
};
阿迪西奥纳教授

---

以下是

在您的HTML中找不到脚本中引用的任何元素。哪里定义了“conteudo”？对不起，我忘记添加div代码了。基本上，按钮仍然缺失。@PatrickMaia请编辑您的问题，以提供缺少的其他HTML。不要将其粘贴到评论中。