0

我正在使用面板栏,因此表单标签干扰了它的打开/关闭动画

我发现表单标签正在创建问题,所以我希望 div 标签在单击提交按钮时转换为表单标签。

例如:

<div class="myForm">
<div id="detail">
    Name: <input type="text" name="text_name" value="Some text here to edit"/>
</div>
<div id="income">
    Income: <input type="text" name="text_income" value="your income"/>
</div>
    <input type="submit" value="Submit" />
</div>

转换成:

<form name="input" id="" action="html_form_action.php" method="post">
<div id="detail">
    Name: <input type="text" name="text_name" value="Some text here to edit"/>
</div>
<div id="income">
    Income: <input type="text" name="text_income" value="your income"/>
</div>
    <input type="submit" value="Submit" />
</form>

所以我想要的只是将带有“.myForm”类的 div 更改为 Form 元素,并用关闭表单标签关闭 div。

有没有办法做到这一点?

4

3 回答 3

5

使用 Javascript + jQuery:

$('.myForm').children().unwrap().wrapAll("<form name='input' id='' action='html_form_action.php' method='post'></form>");

这将使用该方法删除包装 div “.myForm” unwrapwrapAll然后用该方法包装它的孩子。

于 2013-07-27T07:09:50.303 回答
1

您可以简单地使用 Jquery 完成这项工作 -

$(document).ready(function(){    
   $('form').html($('.myForm').html());
});

但是如果你想这样做,这是不正确的,因为你使用id了一些元素的分配。因此,在将整个 HTML 附加到您之后,<form>您应该删除.myForm.

尝试这个

with class .myForm对于追加innerhtml到表单后删除 div ,您可以简单地使用.remove.

 $(document).ready(function(){    
       $('form').html($('.myForm').html());
       $('.myForm').remove();
    });

尝试这个

于 2013-07-27T08:13:37.300 回答
0

如果你喜欢 html5,你可以查看 html5 “form Attribute”,它允许你在任何你喜欢的地方使用表单元素,并且你不需要将内容包装在表单标签中。

看一下这个

<form name="input" id="myform" action="html_form_action.php" method="post"></form>

<div class="myForm">
    <div id="detail">
       Name: <input type="text" name="text_name" value="Some text here to edit" form="myform" />
    </div>
    <div id="income">
       Income: <input type="text" name="text_income" value="your income" form="myform" />
    </div>
    <input type="submit" value="Submit" form="myform" />
</div>
于 2013-07-27T07:54:56.633 回答