.html（）empty empty返す

Question

私はWebアプリケーション用にJqueryを使用しています。数字のアップダウンボックスを作成しています。このために、入力<input type="text">を定義済みのdivに置き換えます。

オリジナルの入力ボックスのhtmlを取得したいのですが、スタイルなどを持っている可能性がありますので、.replaceWithのバージョンも追加したいと思っています。

現在のコード<input type="text">
新しいコード

<div> 
    <input type="text"> 
    <div> 
     <!-- Other Stuff --> 
    </div> 
</div> 

私は親要素を作る側面に沿って入力コントロールを再生成する必要が見ることができるようになっています。私が現在行っていることは、すべてを再生成し、.replaceWith()メソッドを使ってすべてを貼り付けることです。

すべてのアイデア？

Answer 1

私はあなたが何をしようとしているかは完全にはわかりませんが、inputの周りにdivという親をラップし、その後にdivを追加したいようです。その場合は、あなたはこのような何かを行うことができます：それはDOMに滞在するよう

$("input").wrap("<div></div>").after("<div></div>"); 

このように、あなたは、input交換する必要はありません。 wrapは選択された要素の周りに引数を囲み、afterは選択された要素の後に内容を挿入します。

ここにはworking exampleがあります。タイプinputの

Answer 2

要素は本当には HTMLが含まれていないが、むしろ、inputタグがその親コン​​テナ（この場合はdiv）内に含まれるHTMLになります。それで、あなたはそれを専用の内側のコンテナに置き、それを取り外して交換することを検討するかもしれません。

Answer 3

おそらくあなたは

があなたの入力を与えるか、IDをwhateever、その後

$('input#yourid').replaceWith('Insert your desired html'); 

好き間違ったセレクタを使用しているリファレンスJQuery API

Answer 4

<input />要素は、それがするので、コンテナではありませんHTML値を持たない。ボックスに入力したテキストの後ろにいる場合は、代わりに.val()メソッドを使用してください。

Answer 5

jQueryの.html()は、内容がなくアトリビュートのみを持っているため<input>要素で使用すると空を返します。

事は、私はそれがなどのスタイルを持っていることとして、元の入力ボックスのHTMLを取得したいです追加

あなたは、元の入力ボックスのstyleとclass属性を取得し、その後にそれらを適用することができます生成された<div>要素、このような何か：

$("someselectorforyournewdiv").addClass($("input").attr("class")); 
// and/or 
$("someselectorforyournewdiv").attr("style", $("input").attr("style")); 

（。明らかに合うようにセレクタを調整する）

しかし、あなたの生成された要素が素敵な「アップダウンボックス」を作るために、独自のスタイルを持っていないのだろうか？入力から元のスタイルを適用した場合でも、色やそのような形に影響を与えないスタイルを選択しない限り、あまりうまく機能しない可能性があります。