javascript - 我怎样才能让这个有用的 JSFiddle 在我的网站上工作？

Question

好的，当我将代码从 JSFiddle 复制到我的站点、HTML、Javascript 和必要的 Jquery 时，我发现这个 JSfiddle 可以在单击时添加另一个输入字段。经过大量研究，我似乎无法弄清楚为什么结果总是没有。实际上这很令人沮丧。让我把代码扔给你，看看你能不能告诉我我在哪里是愚蠢的。 xD

这里是 JSfiddle我要。

HTML:

<h2><a href="#" id="addScnt">Add Another Input Box</a></h2>

<div id="p_scents">
    <p>
        <label for="p_scnts"><input type="text" id="p_scnt" size="20" name="p_scnt" value="" placeholder="Input Value" /></label>
    </p>
</div>





<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script src="js/bootstrap.min.js"></script>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>    
<script src="js/custom.js"></script>

Javascript:

$(document).ready(function() {
        var scntDiv = $('#p_scents');
        var i = $('#p_scents p').size() + 1;

    $('#addScnt').live('click', function() {
            $('<p><label for="p_scnts"><input type="text" id="p_scnt"     size="20" name="p_scnt_' + i +'" value="" placeholder="Input Value" /></label> <a     href="#" id="remScnt">Remove</a></p>').appendTo(scntDiv);
            i++;
            return false;
    });

    $('#remScnt').live('click', function() { 
            if( i > 2 ) {
                    $(this).parents('p').remove();
                    i--;
            }
            return false;
    });
});

我确保将 jquery 放在自定义 JS 文件之后，我用 $(document).ready() 包装了我的 JavaScript我只是不确定接下来要尝试什么。请帮忙!!!谢谢!

Answer 1

您列出了两次 jQuery。你只需要其中之一。这会导致问题:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"</script>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"</script>

另外，你提到 <script src="js/bootstrap.min.js"></script> 但它是否已上传到您的服务器？如果没有，您可以使用这样的 CDN:

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>