jQuery replaceWith显示文本而不是元素

Question

我有以下jQuery用select字段替换输入字段.

input = $("input[id$='id_var']")[0];
input_class = input.getAttribute("class");
input_id = input.getAttribute("id");
input_name = input.getAttribute("name");
//remove input and replace with a select drop down
input.replaceWith("<select class='"+input_class+"' id='"+input_id+"' name='"+input_name+"'></select>");

当我加载页面时运行.但是不是用select html替换元素,而是用html替换它作为文本:

"<select class='input_class_text' id='input_id_var' name='input_name_text'></select>"

所以在页面而不是你刚看到的选择

<select class='input_class_text' id='input_id_var' name='input_name_text'></select>

上述行为的片段:

input = $("input[id$='id_var']")[0];
input_class = input.getAttribute("class");
input_id = input.getAttribute("id");
input_name = input.getAttribute("name");
//remove input and replace with a select drop down
input.replaceWith("<select class='"+input_class+"' id='"+input_id+"' name='"+input_name+"'></select>");

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input id="id_var" type="text" />

有人能告诉我为什么会这样吗？

谢谢

Answer 1

您正在调用.replaceWith()DOM元素,而不是JQuery对象.只需编辑您的第一行:

input = $("input[id$='id_var']");

然后调整你的下一行:

input_class = input.attr("class");
input_id = input.attr("id");
input_name = input.attr("name");