0

ちょっとした質問です。私はいくつかの JavaScript を持っています。機能ブロックをクリックすると、一部の div のコンテンツが変更されます。下のコードからわかるように、#pubcontent にはいくつかのリンクがページに追加されています。

$("#publications").click(function(){
    $("#content").html('<iframe id="idIframe" src="publication/index.html" style="height:594px;width:98%;"></iframe>');
    $("#titlepage").html('<img src="../images/pageline.png" style="width:2px; height:50px; vertical-align:middle"/>Home&nbsp;&nbsp;>&nbsp;&nbsp;Publications');
    $("#researchcontent").html('');
    $("#pubcontent").html('<ul><li><a id="2013" href="#">2013</a></li><li><a id="2012" href="#">2012</a></li><li><a id="2011" href="#">2011</a></li><li><a id="2010" href="#">2010</a></li><li><a id="2009" href="#">2009</a></li><li><a id="2008" href="#">2008</a></li></ul>');
});

これは機能しています。しかし今、#pubcontent の一部であるリンクをクリックしたときに実行する必要がある別のコードが同じ JavaScript ファイルに含まれています。しかし、リンクをクリックしても何も起こりません。このコードは次のとおりです。

$("#2013").click(function(){
    $("#content").html('<iframe id="idIframe" src="publication/index.html#2013" style="height:594px;width:98%;"></iframe>');
    $("#titlepage").html('<img src="../images/pageline.png" style="width:2px; height:50px; vertical-align:middle"/>Home&nbsp;&nbsp;>&nbsp;&nbsp;Publications&nbsp;&nbsp;>&nbsp;&nbsp;2013');

要約すると。x を押すと y が表示されます。y のリンクをクリックすると、z が表示されます。しかし、「z」部分を表示する方法が見つかりません。この説明が役立つかどうかはわかりません..しかし、誰か提案はありますか？

4

2 に答える 2

3

動的に追加された要素に委任を使用する:

$("#pubcontent").on('click',"#2013",function(){...});

もちろん、ID はコンテキスト ページ内で一意である必要があるため、ID が「2013」の要素は一意である必要があります。

于 2013-07-03T08:08:02.560 に答える
0

$("#publications").click(...) 関数内の最後の行の直後に 2 番目のコード ブロックを配置する必要があります。

ページの読み込み時にこれを初期化することはできません。jQuery は $("#2013") をリッスンしません。その時点では $("#2013") が存在しないためです。

これを試して：

$("#publications").click(function(){
    $("#content").html('<iframe id="idIframe" src="publication/index.html" style="height:594px;width:98%;"></iframe>');
    $("#titlepage").html('<img src="../images/pageline.png" style="width:2px; height:50px; vertical-align:middle"/>Home&nbsp;&nbsp;>&nbsp;&nbsp;Publications');
    $("#researchcontent").html('');
    $("#pubcontent").html('<ul><li><a id="2013" href="#">2013</a></li><li><a id="2012" href="#">2012</a></li><li><a id="2011" href="#">2011</a></li><li><a id="2010" href="#">2010</a></li><li><a id="2009" href="#">2009</a></li><li><a id="2008" href="#">2008</a></li></ul>');
    $("#2013").click(function(){
        $("#content").html('<iframe id="idIframe" src="publication/index.html#2013" style="height:594px;width:98%;"></iframe>');
        $("#titlepage").html('<img src="../images/pageline.png" style="width:2px; height:50px; vertical-align:middle"/>Home&nbsp;&nbsp;>&nbsp;&nbsp;Publications&nbsp;&nbsp;>&nbsp;&nbsp;2013');
    });
});
于 2013-07-03T08:07:42.527 に答える