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をフォーム要素に変更し、フォームタグを閉じて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" が削除されunwrapます。wrapAll次に、その子をメソッドでラップします。

于 2013-07-27T07:09:50.303 に答える
1

この作業は、Jquery を使用して簡単に行うことができます -

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

しかし、これを行いたい場合はid、いくつかの要素の代入を使用しているため、これは正しくありません。したがって、HTML全体を追加した後、<form>を削除する必要があります.myForm

これを試して

with class .myFormフォームに追加した後にdiv を削除するinnerhtmlには、単純に.remove.

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

これを試して

于 2013-07-27T08:13:37.300 に答える
0

html5 が気に入った場合は、html5 の「フォーム属性」をチェックしてください。これにより、フォーム要素を好きな場所で使用でき、コンテンツをフォーム タグ内にラップする必要がなくなります。

これをチェックしてください

<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 に答える