jquery - Jquery 错误：Microsoft JScript 运行时错误：无法获取属性“html”的值：对象为空或未定义

Question

在我的 MVC3 剃须刀页面上，我正在尝试通过单击按钮动态添加文本框

下面粘贴的是我的 Jquery。但是当我单击 addButton 时，我收到上述错误消息。

要解决此错误，我尝试添加 <script type="text/javascript" src="jquery-1.3.2.min.js"></script> ，但仍然收到相同的错误。感谢您解决此错误的建议。

<script type="text/javascript">



    $(document).ready(function(){



        var counter = 2;



        $("#addButton").click(function () {



            if(counter>10){

                alert("Only 10 textboxes allow");

                return false;

            }   



            var newTextBoxDiv = $(document.createElement('div')).attr("id", 'TextBoxDiv' + counter);

                newTextBoxDiv.after().html('<label>Textbox #'+ counter + ' : </label>' +

                '<input type="text" name="textbox' + counter + 

                '" id="textbox' + counter + '" value="" >');



            newTextBoxDiv.appendTo("#TextBoxesGroup");



            counter++;

        });



        $("#removeButton").click(function () {

            if(counter==1){

                alert("No more textbox to remove");

                return false;

            }   

            counter--;



            $("#TextBoxDiv" + counter).remove();

        });



        $("#getButtonValue").click(function () {



            var msg = '';

            for(i=1; i<counter; i++){

                msg += "\n Textbox #" + i + " : " + $('#textbox' + i).val();

            }

            alert(msg);

        });



  });

</script>

Answer 1

这似乎很明显。如果您在after()没有任何内容的情况下调用，则您什么也没有创建。如果你试图得到html()什么……你什么都得不到。

您可能想查看after() 文档。

Answer 2

您可能想一直使用 jquery 而不是混合原生 DOM 和 jquery。这个实际上会起作用：

var newTextBoxDiv = $('<div id="TextBoxDiv' + counter + '"><label>Textbox #'+ counter + ' : </label><input type="text" name="textbox' + counter + '" id="textbox' + counter + '" value="" ></div>');