1

[設定の編集]ボタンを追加したい次のリストアイテムがあります。

<li class="draggableBucketItem ui-state-default" id="bucketItem75" bucketID="2" pageModuleID="75"><span class="spnName">HTML Content</span><li>

jQueryを使用して、リストアイテムにスパンを追加します。

$('#bucketItem75').append('<span class="spnEditModule">Edit Settings</span>');

リストアイテムは静的に配置されており、ページを出力して手動でリストアイテムにスパンを含めると、適切に配置されます。しかし、jQueryを使用して追加すると、ページの右上隅のリストアイテムの外側に表示されます。

私は明らかにここで何かが欠けているので、誰かがアイデアを持っているなら、それは大いにありがたいです。

ありがとうございました、

クリスハンプトン

Webコーディネーター

コロラド州立大学

編集:

私はこれでうまくいくと思いました(そしてそれでもそうかもしれません)が、私はまだ問題を抱えています。'combine the internal html'ルートを使用しましたが、リストアイテムのhtmlをコンソールに書き込むと、正しく表示されます(ページの読み込み時にサーバーコードから出力されるものと一致します)。

<span class="spnName">HTML Content</span><span class="spnEditModule">Edit Settings</span>

これがアイテムのCSSです

.draggableBucketItem span.spnEditModule{position: absolute; top: 3px; right: 3px; font-weight: bold; color: #fff;}

.draggableBucketItemクラスの位置は次のとおりです。それに適用されます。

4

1 に答える 1

0

Append()は、リスト項目要素の後に新しいスパンを配置します。リスト項目の html を取得して 2 つを結合するか、リスト項目内に既に存在するスパンに追加します。

リスト項目の子への追加は機能するはずです:

$('#bucketItem75').children().append('<span class="spnEditModule">Edit Settings</span>');

jsbin の例

于 2009-10-23T18:09:25.960 に答える