2

この例を見てください: http://jsfiddle.net/9NXHq/15/

HTML で定義された 1 つのボタンから始まります。次に、jQuery を使用してそのボタンを複製し、テキストを変更して、元のボタンの後に追加します。新しいボタンの表示がおかしくなっていることに気付きましたか? しかし、アイコンが変更されるボタンをクリックすると、それ自体がクリーンアップされます! すでにjQueryされている要素を複製する適切な方法は何ですか?

たとえば、データのリストと「追加」ボタンを想像してください。[追加] をクリックすると、ボタンやオートコンプリートなどの jQueryed 要素を含む (たとえば、非表示のテンプレート行からの) データの行全体が複製されます。この新しい行の要素が適切に機能するようにするには、どのように「再構成」する必要がありますか? ?

HTML

<a id="btn">This is a button.</a>​

CSS

/* Standard jQuery UI (1.8.16 in this case). */

JavaScript

/* Standard jQuery (1.7.1 in this case). */

var btn = $("a#btn");
var btn2 = null;

btn.button({ icons: { primary: "ui-icon-plus" } });
btn.click(function ()
{    
    $(this).button({ label: "Clicked!", icons: { primary: "ui-icon-check" } });
});

btn2 = btn.clone();
btn2.click(function ()
{    
    $(this).button({ label: "Clicked! (2)", icons: { primary: "ui-icon-check" } });
});                   
btn2.text(btn2.text() + " (2)");
btn2.insertAfter(btn);

//Need to re-constitue btn2 as a button.
btn2.button();
4

1 に答える 1

3

私はこれを自分でやろうとしたことを覚えています。これが私が解決した解決策でした。

// Get source buttons options.. for icons and stuff. 
var btn_options = btn.button('option');

// Clone the button, change the ID, and re-init the button. 
var btn2 = btn
  .clone()
  .attr("id", "btn2")
  .button(btn_options);

私は .clone(true) を試しましたが、前のもののすべてのバインドされたイベントで終わります。.button() は単純に .clone を実行するにはあまりにも多くのことを行います。設定をコピーして再初期化する方が簡単であることがわかりました。

これはフィドルです：http://jsfiddle.net/9NXHq/23/

于 2012-12-19T22:14:11.587 に答える