0

Dom 要素に 2 つの HTML 要素を次々と追加したいと考えています。ただし、この呼び出しは jQuery では機能しません

$("<button>click me</button>").after("<span> or be happy </span>")
                              .appendTo("#someId");

2 つの要素を 1 つの文字列に結合できない理由は、イベント ハンドラーを最初の文字列に追加したいからです。だから私が本当にやりたいことは次のとおりです。

$("<button>click me</button>").after("<span> or be happy </span>")
                              .on("click", function() {
                                  // do something
                              });

現在、私の回避策は、ID をボタンに割り当て、別の jQuery 呼び出しで「スパン」を追加することです。そのようです...

$('<button id="uid">click me</button>').on("click", function() {
                                            // do something
                                           });
$('#uid').after('<span> or be happy</span>');

もっと良い方法がありますか?

4

2 に答える 2

1

.after()の後に を実行するだけです.append()

http://jsfiddle.net/Kr9m4/

$("<button>click me</button>").on("click", function() {
    // do something
})
    .appendTo("#someId")
    .after("<span> or be happy </span>");

またはこのように:

http://jsfiddle.net/Kr9m4/1/

$("<button>", { text:"click me",
               click: function() {
                  // do something
               }})
    .appendTo("#someId")
    .after("<span> or be happy </span>");
于 2012-05-10T15:48:20.743 に答える
0

その場合、次のようにする必要があります。

var _button = $('<button>')
                  .text('click me')
                  .on('click', function () { }),
    _span = $('<span>').text(' or be happy');

// not sure about the order, so just switch these two if ever
$('#foo').after(_button).after(_span);

編集

ドキュメントによると、ノードがまだ切断されていない場合でも、実際にDOMノードを挿入(および操​​作)できます。ただし、これはjQuery1.4以降を想定しています。

したがって、その法案に適合すれば、1つのステートメントですべてを実行できるはずです。

$('<button>').text('click me')
             .on('click', function () {
                 // ...
             })
             .after('<span>')
                 .text(' or be happy')
                 .appendTo('#uid')
                 ;
于 2012-05-10T14:56:13.873 に答える