如何用另一个 DOM 替换 $(this) 中的 DOM

Posted 2023-05-09

【中文标题】如何用另一个 DOM 替换 $(this) 中的 DOM

【英文标题】：How can i replace the DOM in $(this) with another DOM

【发布时间】：2013-04-17 23:41:43

【问题描述】：

我有如下 html 内容

<div class="form-field">
     <div style="width: auto; display: inline-block; min-width: 108px;" class="form-field-header">
      <div class="form-field-header-caption">facility</div>
      </div>
      <div style="display: inline-block;" class="form-field-body">
      <input class="form-field-required" readonly="" maxlength="20" value="" type="text" data-binding-view-property="Value" data-binding-model-object="inwork" data-binding-model-property="fac">
       <textboxcontrol class="form-field-required" data-binding-view-property="Value" maxlength="20" data-binding-model-object="inwork" data-binding-model-property="fac"></textboxcontrol>
       </div>
  </div>

对于上面的 HTML 内容，我正在编写一个 jQuery 代码来替换插件提供的 DOM 元素。 jQuery 脚本如下

$(window).load(function () 
    $(".form-field").find('textboxcontrol').each(function () 
        var options = 
            "attributeName": 'test',
            "defaultValue": "",
            "isViewonly": 0,
            "isReadOnly": 0,
            "filterAttribute": 0
        ;
        field = $.fn.textBoxControl(options);
        $(this).replaceWith(field);
    );
);

field 变量会有类似的数据

<input class="textboxControl" maxLength="2147483647" value="" type="text">

作为 DOM（即 - firebug DOM 中的 field[0].outerHTML）

$(this) - 将从 HTML 内容中选择标签。上面写的代码正在替换 DOM。请帮我解决。

【问题讨论】：

.replaceWith() 肯定不行吗？您是否在浏览器的控制台中收到任何错误消息？

不清楚你在这里问什么 - 什么没有按预期工作？

用户定义的标签（即 ）应该被插件 $.fn.textBoxControl(options) 返回的 DOM 替换

您能告诉我们$.fn.textBoxControl(options); 返回的确切内容吗？

返回上面解释中提到的 DOM。

【参考方案1】：

想出了一个用这个解决方案替换线路的解决方案。$(this).replaceWith(field[0].outerHTML) 不管怎样，谢谢大家。