0

はい、jquery と javascript は初めてです。ajax経由でページに書き込まれる静的htmlとpython生成データの両方を持つページがあります。既にページにある静的な html データに対しては正常に機能する jquery スライダーがありますが、新しく更新されたコンテンツでは機能しません。jquery スライダー コードを静的 html ページと外部 javascript ソース ページに配置してみました。どちらも機能しません。新しいデータをページに書き込む Python スクリプトに jquery スライダー コードを配置した場合にのみ機能します。動的データの次のセットがインポートされたときに何が起こるか本当に気に入りません。私が間違っていることはわかりません....

jqueryコード:

$(document).ready(function(){
  $(".noIbar").click(function(e){
    if (e.ctrlKey)
      {
        $(this).next(".panel").slideToggle("fast");
      }
  });
});

これは、コードの作業セクションのスクリーンショットです。ユーザーがコントロール キーを押したまま最初の (静的 html) 行をクリックすると機能しますが、Python スクリプトを介して返される 2 行目は機能しません。これは、jquery の呼び出し方法に関係しているように感じます。

body タグで onload を介して ajax スクリプトを呼び出しています。

<body  onload="test();loadcontent();">

「loadcontent()」関数は次のとおりです。

function loadcontent()
{
$(document).ready(function(){    
$.get('cgi-bin/content.py', function(data) {
    $("#content").append(data);
});
});
}

これは、python スクリプトからの正確な出力です。

<div class='noIbar' onclick="highlightLink(this);AddVar('1.2.840.113970.3.33.1.16671800.20120327.1134351')">
  <div class='data'>105630</div>
  <div class='data'>ISO_IR 100</div>
  <div class='data'>20120327</div>
  <div class='data'>135346.000</div>
  <div class='data'>00035MR120014044</div>
  <div class='endcap'>2681</div>
</div>
<div class='panel'>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.8.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.9.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.10.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.11.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.12.jpg"></div>
</div>

<div class='noIbar' onclick="highlightLink(this);AddVar('1.2.840.113970.3.33.1.14883629.20111109.1132327')">
  <div class='data'>121011</div>
  <div class='data'>ISO_IR 100</div>
  <div class='data'>20111109</div>
  <div class='data'>133143.000</div>
  <div class='data'>00035US110137393</div>
  <div class='endcap'>US OB</div>
</div>
<div class='panel'>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.8.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.9.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.10.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.11.jpg"></div>
  <div class='img'><img src="icon/1.2.840.113619.2.5.2431209.13665.1332882288.12.jpg"></div>
4

1 に答える 1

1

問題の修正は次のとおりです。

$(document).ready(function(){    
    $.get('cgi-bin/content.py', function(data) {
        $("#content").append(data);
        $(".noIbar").click(function(e){
            if (e.ctrlKey)
            {
                $(this).next(".panel").slideToggle("fast");
            }
        });
    });
});

ajax 呼び出しの前にコールバック関数を追加しました。DOM にコンテンツを追加している Python スクリプトから応答を取得した後、追加された新しいコンテンツは、新しい要素に対して再度定義しない限り、コールバック イベントに応答しません。

于 2013-02-11T07:33:30.473 に答える