冲突:加载子页面时,JavaScript无效

时间:2012-02-14 13:00:25

标签: javascript jquery html load

我正在尝试将this particular app整合到我的网站中。

当我将其作为内容加载到我的主页面时,主页面上的jquery菜单停止工作。这里似乎存在冲突。 以下是子页面中的脚本:

<script type='text/javascript'>
  $(function() {
    var bucharest = new google.maps.LatLng(44.436055, 26.097593),
      pointToMoveTo, 
      first = true,
      curMarker = new google.maps.Marker({}),
      $el;

  var myOptions = {
      zoom: 13,
      center: bucharest,
      mapTypeId: google.maps.MapTypeId.ROADMAP
    };

  var map = new google.maps.Map($("#map_canvas")[0], myOptions);

  $("#locations li").mouseenter(function() {

    $el = $(this);

    if (!$el.hasClass("hover")) {

      $("#locations li").removeClass("hover");
      $el.addClass("hover");

      if (!first) { 

        // Clear current marker
        curMarker.setMap(); 

        // Set zoom back to Bucharest level
        // map.setZoom(10);
      }

      // Move (pan) map to new location
      pointToMoveTo = new google.maps.LatLng($el.attr("data-geo-lat"), $el.attr("data-geo-long"));
      map.panTo(pointToMoveTo);

      // Add new marker
      curMarker = new google.maps.Marker({
          position: pointToMoveTo,
          map: map,
          icon: "images/marker.png"
      });

      // On click, zoom map
      google.maps.event.addListener(curMarker, 'click', function() {
         map.setZoom(14);
      });

      // Fill more info area
      $("#more-info")
        .find("h2")
          .html($el.find("h3").html())
          .end()
        .find("p")
          .html($el.find(".longdesc").html());

      // No longer the first time through (re: marker clearing)        
      first = false; 
    }

  });

  $("#locations li:first").trigger("mouseenter");

});

以下是主页中菜单的脚本:

$(document).ready(function() {
    $("ul#nav li a").addClass("js");
    $("ul#nav li a").hover(
      function () {
        $(this).stop(true,true).animate({backgroundPosition:"(0 0)"}, 200);
        $(this).animate({backgroundPosition:"(0 -5px)"}, 150);
      },
      function () {
        $(this).animate({backgroundPosition:"(0 -149px)"}, 200);

      }
    );

});

这两者之间是否存在冲突? 谢谢!

1 个答案:

答案 0 :(得分:1)

我认为你的第一份文件中有错误。已经

here : $(function() {

所以第二个文件。已经

this one : $(document).ready(function() {