2019-12-08 JQuery的html()方法与after

最近做的一个需求是，动态添加联系人，这个联系人是一个表单形式，包括电话，姓名，电话类型等字段。实现方法是使用一个隐藏的div来添加。

<div class="contactBlank" style="display:none">

    <input type="text" name="phoneNo"></input>

    <input type="text" name="contactName" ></input>

    <input type="text" name= "telType"></input>

</div>

<div class="contact">

    <input type="text" name="phoneNo"></input>

    <input type="text" name="contactName" ></input>

    <input type="text" name= "telType"></input>

</div>

function addContact() {

    var inputs = $('.contactBlank').html(); // 这样只能得到三个input，而得不到div这一层。

    $('.contact:last').after('<div class="contact"> ' + inputs + '</div>');

}

在div中的回调函数，比如onchange事件，<input type="text" name="phoneNo" onchange="changePhoneNo(this)" ></input>

<script>标签中定义函数时要传入一个obj，而不能是this。

function changePhoneNo(a) {// 不能传this

      .......

}