Javascript 在jQuery中使用“DOMNodeInserted”包装select元素时出现问题

我想在将每个select元素插入到具有id hook的div中时将其包装起来，数据是使用一些不在我控制范围内的ajax请求插入的

它可以工作，但是出现了一些不需要的div，并且出现了一个错误：

未捕获范围错误：超过最大调用堆栈大小

我想要的是：

防止这些不需要的div在输入类型文本上方以红色突出显示。 是否有其他域名插入的替代方案可用于更好的浏览器支持。 这是我的密码笔：

HTML代码

<div id="data">
    <select>
        <option>1</option>
        <option>2</option>
        <option>2</option>
    </select>

    First name: <input type="text" name="fname">
</div>

---

您的问题是，对selectUi的调用是在钩子中插入一个div，因此再次调用事件处理程序，然后再次调用selectUi，插入另一个div，从而调用事件处理程序等。您可以通过在调用事件处理程序时禁用它来解决此问题，例如

  $('#hook').on('DOMNodeInserted', function() {
    $('#hook').off('DOMNodeInserted');
    $('#hook > select').each(function(e) {
      selectUi($(this));
    });

$document.readyfunction{ $'hook'。在'DOMNodeInserted'函数上{ $'hook'。关闭'DOMNodeInserted'； $'hook>select'。每个函数{ 选择ui$this； }; }; //函数的开始不在我的控制范围内，它可能是一些ajax请求 设置超时 作用{ $'hook'.html$'data'.html； }, 1000; //函数的结尾不在我的控制范围内，它可能是一些ajax请求 }; 函数selectUithatSelect{ thatSelect.wrap； } .选择框{ 宽度100%背景色：红色； 垫底：1px； 边框底部：1px纯红； } 资料{ 显示：无； } 1. 2. 3. 名字：

---

谢谢@Nick为您花费的时间和精力，我的第二点是什么？是否有其他替代的DOMNodeInserted可用于更好的浏览器支持。@Syed您可以使用MutationObserver，所有浏览器的当前版本都支持它。请参阅我的编辑。Opera Mini也不支持突变观察员。@Syed啊-我没有注意到文档页面上测试的浏览器列表中缺少Opera Mini。也许您可以为该浏览器使用DOMNodeInserted，尽管它已被弃用，因此不是一个长期的解决方案

.select-box{
  width 100%
  background-color: red;
  padding-bottom: 1px;
  border-bottom: 1px solid red;
}

#data{
  display:none;
}

  $('#hook').on('DOMNodeInserted', function() {
    $('#hook').off('DOMNodeInserted');
    $('#hook > select').each(function(e) {
      selectUi($(this));
    });