1

新しい DIV を作成するツールチップ効果を作成しようとしています。別のページのコンテンツで塗りつぶし、その画像がマウスオーバーされたときに画像の下に表示します。div を作成し、コンテンツとマウスオーバーで埋めるコードを次に示します。

$(document).ready(function() {
    $('<div id="DETAILS"> </div>').appendTo("body");
    $('#DETAILS').load('Test.html #CREATEYOUROWN');
    $("#DETAILS").hide();
    $('#PUZZLE').mouseover(function() {
        $("#DETAILS").show();
    });
    $('#PUZZLE').mouseleave(function() {
        $("#DETAILS").hide();
    });
});​

これは機能します。ただし、これを CMS に配置する必要があります。これらのうち約 20 個がアイテムとして設定され、コンテンツ エディターによってページに追加され、ページを作成するときにリストから文字通り選択されます。これらのアイテムには JavaScript を関連付けることができますが、ページに追加されたときに独自の ID を持っていません。唯一変わらないのは画像ソースです。

画像ソースを使用して画像の ID を変更する方法はありますか?

私はまだ jQuery にまったく慣れていないので、この全体をより良くする方法があれば、アドバイスをいただければ幸いです。

4

2 に答える 2

0

jsRender のような JavaScript テンプレート エンジンを使用する必要があるようです: https://github.com/BorisMoore/jsrender

そうすれば、テンプレートを作成して、ID を次のように定義できます。

<div id="mydiv_{{>counter}}"></div>

jsRender のデモとサンプル コード: http://borismoore.github.com/jsrender/demos/index.html

また、他にも多くのエンジンがあることを覚えておいてください。私はたまたま jsRender が気に入っただけです。

于 2012-09-21T12:16:34.730 に答える
0

私は問題を正確に理解していませんが、ソースでアイテムを選択し、jQuery を使用してそのように ID を変更できます。

$('[src="image"]').attr('id', 'newId');

これが役立つかどうかはわかりませんが、試してみてください。

于 2012-09-21T12:24:14.757 に答える