2011-06-28 5 views
1

私のHTML/jQueryのコードは次のようになります。jQueryのラップ:結果を返すが、ソースを変更することなく、

<html> 
... 
many code 
... 
    <button onclick="alert($('#mytable').html().wrap('<html/>'));">Show HTML Table</button> 

    <table id="myTable"> 

     <tr's and td's> 
    </table> 
... 
many code 
... 
</html> 

私はJavascriptをHTMLタグで包まれたテーブルを返すようにしたいが、私はテーブルを望んでいませんそれ自体が変更される。

ヒント?

+1

「私はテーブル自体を変更する必要はありません。」:

あなたは.html()、ノードを.clone()いくつかのダミー素子に添付して返すことができますどのように「変更された」という意味ですか? –

+0

私はwrap要素(その場合はhtml)によって変更されることを意味します。そして、はい、私はhtml()ラップがうまくいかなかったのを見ましたが、テーブルのhtmlコード(

から
まで)を折り返したいと思っています。 –

答えて

3

これは機能しません。 .html()は、jQueryオブジェクトではなく文字列を返します。だから、wrapに電話することはできません。

.html()は、の内部HTMLのみを返します。tableタグは含みません。

var html = ['<html><body>', 
      $('<div/>').append($('#mytable').clone()).html(), 
      '</body></html>'].join(''); 
+0

それはトリックですが、最終的には、この操作で#mytableが変更されていないので、clone()関数は必要ないと思います。 –

+1

@ruffp: '.append'を呼び出すと、渡した要素は現在の位置から削除され、新しい位置に追加されます。したがって、クローンを作成しないと、テーブルはページから削除されます。 –

+0

説明をありがとう –

0

理由だけではなく、次の手順を実行しない?:

table自体を変更することなく、 wrap機能に供給されたタグにテーブルをラップします
alert('<html>'+$('#mytable').html()+'</html>'); 
+1

.htmlの問題は、テーブル定義を返さず、その内部にあるものだけです – Rodolfo

0
$("#myTable").wrap("..."); 

詳細については、wrap機能のjQuery APIを参照してください。

4

あなたは最初のテーブルのコピーを取ることができる:

(function($) { 
    $.fn.outerhtml = function() { 
     return $('<div/>').append(this.clone()).html(); 
    }; 
})(jQuery); 

$('#mytable').clone()... 

あなたは私がanother answer yesterdayに投稿されたこのプラグインのようなものを必要とするだろうタグの実際のHTMLを取得するにはだから、それから行うことができます。

alert('<html>' + $('#myTable').outerhtml() + '</html>'); 

は、作業のデモ用http://jsfiddle.net/alnitak/2y988/を参照してください。

+0

'html()'は文字列を返します。 '.wrap()'は文字列に対しては機能しません。 –

+1

@Felixはい、本当です - 私はOPのコードをコピーしていました。一方、 '.html()'では囲みタグも表示されません。うーん。 – Alnitak

1

多分、jQuery outerHTML pluginがお手伝いします。これは、囲みのある<table>タグを含むテーブルのコードを提供します。おそらくalert("<html>" + $("#myTable").outerHtml() + "</html>")のようなことをすることができます。

関連する問題