PHP をミックスに投入する前に、コードの基本的な HTML には非常に多くの問題があります。
- 属性では
" "
、値を引用符で囲む必要があります。
- HTML を別の HTML タグの属性内に配置する場合は、エスケープする必要があります。
- 文字列全体が PHP でない限り、PHP に
<?php ?>
タグを挿入する必要があります。
- HTML タグで同じ ID が何度も使用されています。ID はページ上で一意である必要があるため、ID を頻繁に再利用する場合は、代わりにクラスにします。
- は HTML アンカーの有効な属性ではないと思います
content
(有効な場合は、この点を無視してください)。カスタム アトリビュートには、理想的にはプレフィックスを付ける必要がdata-
あるため、この場合、アトリビュートは になりますdata-content
。
最初に行うべきことは、リンクに追加できる独自の PHP 変数にコンテンツ部分を分離することです。これにより、コードの読みやすさと構成が大幅に向上します。
HTML属性を変更せずにPHPを修正
<?php
$content = '<div id="imagcon">
<img src="' . $row['images'] . '" class="tooltip-image" />
</div>
<div id="con">Address:' . $row['Address'] . '</div>
<div id="con">Contact:' . $row['contact'] . '</div>
<div id="con">Email:' . $row['email'] . '</div>
<div id="con">Status:' . $row['status'] . '</div>
<div id="con">Age:' . $row['age'] . '</div>';
echo '<a href="#" alt="Image Tooltip" rel="tooltip" content="' . $content . '">' . $row['Name'] . '</a><br />';
?>
HTML コンテンツを次のように変更することをお勧めしますが、可能であれば:
繰り返される ID の代わりにクラスを使用し、一意の ID を持つ外側の div ラッパーも備えているため、CSS または JavaScript から内側の要素を効果的にターゲットにすることができます。データベース テーブルに列がない場合はid
、主キー フィールドの名前に置き換えます。主キーがない場合は、ループ内のカウンターに置き換えます (そうするべきです)。行をループしてこれらのリンクを出力しているように見えるため、これを追加しました。そうでない場合は、外側の div を削除できます。最後に、リンクのcontent
属性をdata-content
代わりに変更しました。
<?php
$content = '<div id="row-' . $row['id'] . '">
<div class="imagcon">
<img src="' . $row['images'] . '" class="tooltip-image" />
</div>
<div class="con">Address:' . $row['Address'] . '</div>
<div class="con">Contact:' . $row['contact'] . '</div>
<div class="con">Email:' . $row['email'] . '</div>
<div class="con">Status:' . $row['status'] . '</div>
<div class="con">Age:' . $row['age'] . '</div>
</div>';
?>
CakePHP の同等物
<?php
$content = '<div id="row-' . $row['id'] . '">
<div class="imagcon">' . $this->Html->image($row['images'], array('class' => 'tooltip-image')) . '</div>
<div class="con">Address:' . $row['Address'] . '</div>
<div class="con">Contact:' . $row['contact'] . '</div>
<div class="con">Email:' . $row['email'] . '</div>
<div class="con">Status:' . $row['status'] . '</div>
<div class="con">Age:' . $row['age'] . '</div>
</div>';
echo $this->Html->link($row['name'], '#', array(
'alt' => 'Image Tooltip',
'data-content' => $content,
'rel' => 'tooltip'
));
echo '<br />';
?>