Javascript 访问附加/前置元素

我有一个表单，它有一个电话字段和一个添加另一个电话号码的按钮

<div class="form-group form-inline phone">
    <label class="col-sm-2 control-label">Phone</label>
    <div class="col-sm-10">
        <input type="text" class="form-control" id="phonetype1" placeholder="Type of Phone">
        <input type="text" class="form-control" id="number1" placeholder="Write here your phone number">
    </div>
</div>
<span id="newPhone"> Add a phone number</span>

此函数不针对新字段执行。我认为这是因为DOM树没有更新，所以我的jQuery函数不知道这些新的输入字段

即使它们不在DOM树中，我如何访问它们？如果不可能，或者更好，如何将字段插入DOM树

谢谢大家:

编辑：

再研究5分钟，我就找到了解决方案

我在上使用不当，下面是如何正确委派模糊事件

$("form").on('blur','input',function(){
    var formElementId = $(this).attr("id");
    validateField(formElementId); //This function works, for sure
});

---

事件委派是关键，请参见文档方法

加

因为模糊事件不会出现气泡，所以可以尝试使用

文件：

focusout事件被发送到元素或任何元素时 在它里面，失去了焦点。这与中的模糊事件不同 它支持检测后代元素的焦点丢失 换句话说，它支持事件冒泡

---

阅读关于事件委派的详细信息。您需要将模糊事件委派给静态父级，以便新元素将触发事件。可能重复的。。。问题是，模糊不冒泡，因此不能授权！你需要看一下。谢谢你提供关于focusout的提示。在我的情况下，看起来比模糊更好。不客气！是的，你是对的，我个人从不使用模糊事件：p

$(function()
{
    $("input").on('blur',function(){
        var formElementId = $(this).attr("id");
        validateField(formElementId); //This function works, for sure
    });
});

$("form").on('blur','input',function(){
    var formElementId = $(this).attr("id");
    validateField(formElementId); //This function works, for sure
});