0

我有一个 php for 循环,它从 Json 对象中查找数据,并根据这些信息创建不同的 div 和不同的链接:

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

之后,我编写了一个 Java 脚本来创建不同的 div(具有不同的名称),它应该在鼠标悬停时弹出(使用 Jquery 脚本)

<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 回答