0

Jsonオブジェクトからデータを検索し、これらの情報に基づいてさまざまなdivとさまざまなリンクを作成するphpforループがあります。

echo $remoteTownFB . " - " . 
  "<a href=\"#\" id=" . $remoteTownFB . "_trigger>" .$eventName . "</a></br>";

その後、（Jqueryスクリプトを使用して）マウスオーバー時にポップアップするさまざまなdiv（異なる名前）を作成するJavaスクリプトを作成しました。

<script type="text/javascript">
var samplediv = document.createElement('div');
samplediv.id = '<?php echo $remoteTownFB . "_info" ?>';
var txt = document.createTextNode("Informationen über: <?php echo $eventName?>");
document.getElementById('pop-up').appendChild(samplediv);
document.getElementById('pop-up').appendChild(txt);
</script>

私の問題はJqueryスクリプトです。$.eachすべての町の名前が含まれている配列を試してみましたが、理解できませんでした。これが私のベースです：

$(function() {
  var moveLeft = 20;
  var moveDown = 10;

  $('a#trigger').hover(function(e) {
      $('div#pop-up').show().;
    }, function() {
      $('div#pop-up').hide();
    }
  );

  $('a#trigger').mousemove(function(e) {
    $("div#pop-up").css('top', e.pageY + moveDown).css('left', e.pageX + moveLeft);
  });

});

ヘルプやアイデアはありますか？

4

1 に答える 1

0

まず、id-property を閉じるのを忘れました:

echo $remoteTownFB . " - " . 
"<a href=\"#\" id=" . $remoteTownFB . "_trigger\">" .$eventName . "</a></br>";

次に、ポップアップが機能するようにするには、次のことを試してください。

<script type="text/javascript">
var samplediv = document.createElement('div');
samplediv.id = '<?php echo $remoteTownFB . "_info" ?>';
samplediv.style.display = 'none';
var txt = document.createTextNode("Informationen über: <?php echo $eventName?>");
samplediv.appendChild(txt);
document.getElementById('pop-up').appendChild(samplediv);    
</script>

jquery 部分は次のようになります。

<script type="text/javascript">
$(function() {
    $('a[id$="_trigger"]').hover(
        function() {
            var targetSelector = '#' + this.getAttribute('id').replace('_trigger', '_info');
            $('#pop-up, ' + targetSelector).show();
        }, 
        function() {
            var targetSelector = '#' + this.getAttribute('id').replace('_trigger', '_info');
            $('#pop-up, ' + targetSelector).hide();
        }
    );
});
</script>

mousemove通話で何をしようとしているのかよくわからないので、そのままにしておきました。

于 2012-11-05T19:48:38.180 に答える