javascript - 单击按钮后不显示输入字段

Question

我正在尝试添加与某些给定字段相同的额外输入字段。但这不起作用。
这是我的 HTML 代码

<div class="aoe">  
    <p class="aoe_p1">1.</p>  
    <input type="text" class="required aoe_input span7" id="aoe_input_1" name="aoe_input_1" placeholder="like Data Structure & Algorithms or Any subject">  
    <p class="aoe_p2">2.</p>  
    <input type="text" class="required aoe_input span7" id="aoe_input_2"  name="aoe_input_2" placeholder="like Data Structure & Algorithms or Any subject">  
    <p class="aoe_p3">3.</p>  
    <input type="text" class="required aoe_input span7" id="aoe_input_3"  name="aoe_input_3" placeholder="like Data Structure & Algorithms or Any subject">  
    <button class="btn btn-small btn-primary add_another_but">Add Another</button>  
    <div class="container"></div>  
</div>  

这是我的脚本

<script>
$('.add_another_but').click(function() {  
    var input = $('<input type="text" />');  
    var btn = $('<input type="button" value="x" />');  
    btn.click(function() {  
        $(this).parent().remove();  
    });  
    var div = $('<div />');  
    div.append(input).append(btn);  
    $('.container').append(div);  
});  
</script>  

请帮我。

Answer 1

你忘了给你的按钮ID，试试这个：

<button id="add_another_but" class="btn btn-small btn-primary add_another_but">Add Another</button>

jsfiddle：http: //jsfiddle.net/buYd6/

Answer 2

我认为这：$('#add_another_but')应该是：$('.add_another_but')。

因为add_another_but不是 ID 而是类名。由于在 jQuery 中，井号 (#) 用于按 ID 选择元素，点号 (.) 用于按类名选择元素，因此您应该使用点号。

Answer 3

如果您的脚本位于 head 部分，请将其放入文档准备就绪：

jQuery(document).ready(function ($) 
{
    //here
});

否则没关系。