Clone a <form></form> tag and wrap it around existing content?

问题

So There is an existing form tag as such:

<form id="vCSS_mainform" onsubmit="javascript:return QtyEnabledAddToCart_SuppressFormIE();" action="/ProductDetails.asp?ProductCode=40124" name="MainForm" method="post">Bunch of Content</form>

There is a bunch of content inside of this form tag. I need to take just the element of it, clone it, and wrap it around another TABLE element that I have on the page.

I don't want anything in the form tag to be cloned. Is this possible?

I can't just do $("p").wrapAll(""); because that form action contains dymanic content that changes. So i need to find the form tag on whatever page the user is on and clone that exact one.

回答1:

var $clone = $('#vCSS_mainform').clone().empty().attr('id', 'newId');
$('#vCSS_mainform').remove(); // only if you don't need it anymore.
$('#yourTable').wrap($clone);

note: if you remove the original form, you don't need to set a new id for the clone (no need of .attr('id', 'newId'))

回答2:

This is relatively easy to achieve, really all you have to do, is use .clone(), .append() and .empty():

$('#vCSS_mainform').clone().appendTo($('body')).empty();

JS Fiddle demo.

Bear in mind, of course, that duplicate ids are invalid HTML.

---

Edited to complete the answer, to wrap the #accBox you could use:

$('#accBox').wrap($('#vCSS_mainform').clone().appendTo($('body')).empty());

JS Fiddle demo.

References:

• clone().
• appendTo().
• empty().
• wrap().

回答3:

$("#accBox").wrap($('#vCSS_mainform').clone().empty());

Fiddle demo

回答4:

Try someting like this.

function strip(htmlfullstring)
{
   var tmp = document.createElement("formid");
   tmp.innerHTML = html;
   return <form> + tmp.textContent||tmp.innerText+</form>;
}

if i understood your requirement.

来源：https://stackoverflow.com/questions/8174058/clone-a-form-form-tag-and-wrap-it-around-existing-content