0

複数の行と列を持つテーブルがあります。ユーザーが特定のテキストをクリックすると、ダイアログが動的コンテンツで開きます。

例えば

<tr> 
  <td>
    <strong>item1</strong>
  </td>
</tr>
<tr> 
 <td>
    <strong>item2</strong>
 </td>
</tr>

ユーザーが item1 または item2 をクリックすると、JavaScript ウィンドウが開き、関連するテキストが表示されます。

動作しているように見えるprototypejsとwindow.jsを使用してこれを行うことができますが、きれいなjavascriptのようには見えません。

<td>
  <a href='javascript:openModalDialog("<?php echo item1Id?>")'><strong>item1</strong></a>
</td>

<td>
 <a href='javascript:openModalDialog("<?php echo item2Id?>")'><strong>item2</strong></a>
</td>

イベントリスナーを使って邪魔にならないJavaScriptを使いたい

$$('.myClass').invoke('observe', 'click', function(event){
    openModalDialog("dynamic content")  ;   
});


<span class="myClass"><span style="display:none"><?php echo item1Id?></span>item1</span>

<span class="myClass"><span style="display:none"><?php echo item2Id?></span>item2</span>

item1Id、item2Id を表示したくありません。ユーザーが item1 または item2 をクリックしたときに、ポップアップ ウィンドウに表示する必要がある動的コンテンツに PHP で置き換えます。

私は正しい軌道に乗っていますか？

onclick内のitem1Idまたはitem2IdコンテンツにアクセスしてopenModalDialogに渡す方法は?

別のスパン内のスパンが最善の方法であるとはあまり確信していませんが、それが機能していると考えることができる唯一の方法です。

必要なのは、ハンドラー内の動的コンテンツにアクセスする方法です。

例えば

ページの読み込み時

<span class="myClass"><span style="display:none"><?php echo item1Id?></span>item1</span>
<span class="myClass"><span style="display:none"><?php echo item2Id?></span>item2</span>

のようなものになるかもしれません

<span class="myClass"><span style="display:none">This is dynamic content generated by php </span>item1</span>
<span class="myClass"><span style="display:none">some more different content </span>item2</span>

したがって、ユーザーが item1 をクリックしたときのハンドラーで、「これはphpによって生成された動的コンテンツです」というコンテンツが必要なので、openModalDialog関数に渡すことができます。コンテンツにアクセスするにはどうすればよいですか。これは行ごとに異なります。

何か案は？

console.log(this) を実行すると、

4

1 に答える 1

0

私には、あなたは正しい軌道に乗っているようです。item1Id または item2Id にアクセスする方法については、次のデモをご覧ください: http://jsfiddle.net/yg7XX/

お役に立てればと思い、丁寧にコメントさせていただきました。ところで、私はこれまでプロトタイプを扱ったことがありません。私の解決策は、jQuery を使用した結果として得られた単なる推測であり、その推測はうまくいきました! :)

于 2012-06-21T16:29:44.617 に答える