ajaxがロードされたコンテンツのjquery selectorが失敗します

Question

私はajaxを介して読み込まれたダイアログを持っています。そのajaxのpaylaodには、htmlとjavascriptの両方が含まれています。

ダイアログはうまく表示され、そのペイロードに含まれるJSが実行されます。

ただし、ペイロード内のJSから要素（ID、クラス、または要素のいずれであるか）を選択することはできません。

<div> 
    <ul id="testid"> 
    <li>A</li> 
    <li>B</li> 
    </ul> 
</div> 
<script type="text/javascript"> 
    $(document).ready(function() { 
     console.info('test: ' + $("#testid").length); 
    }); 
</script> 

これはテストで結果

：0をコンソールに表示されて

は、ペイロードが持っていたと言うことができます。

セレクタを 'body'で選択するように変更すると、ゼロ以外の値になります。

明らかにロードされたコンテンツが表示されており、JSにはISが実行されています。私の理解では、.ready（）呼び出しでDOM時間を更新してhtmlペイロードを含める必要があります。

残念ながら、このインスタンスでは、私は（zotonic）のためのダイアログ機能を行うフレームワークを使用しているので、私はajaxのロード自体を直接制御することはできません。

私が持っている他のajax読み込みページには、ajax読み込みペイロードの要素を選択するJSがあります。これは（これまでのところ）ダイアログボックスの内容ですが失敗しているようです。

なぜ私はちょうどこれが間違っているのかについて少し迷っています。私は私のデューデリジェンスを行い、解決策なしで日の最後のカップルのためにGoogleなどを検索したので、私はここで助けを叫ぶだろうと思った。

ジェイソン

Answer 1

私はreadyは初回のみのページの負荷を働くと考えています。 AJAX呼び出しの結果に依存する場合は、操作が非同期であるためコールバックを使用する必要があります。 zotonicは、あなたが使うことができるフックを提供していますか？それ以外の場合は少し難しくなります。おそらくあなたは、ページのロード時に、このようなDOMをポーリングすることができます

<script type="text/javascript"> 
    $(document).ready(function() { 
     var interval = setInterval(function() {   
      if($("#testid").length > 0) { 
       clearInterval(interval); 
       console.info('test: ' + $("#testid").length); 
      } 
     }, 750); 
    }); 
</script> 

これは、彼らのページ#testidごとに750msを照会します。要素が見つかった場合、間隔はキャンセルされ、コンソール出力が表示されます。