0

我已经为此工作了几天，但一直无法找到解决方案。基本上，我必须在脑海中编写不会执行$(document).ready(...). 奇怪的是，我还有其他可以很好地使用它的脚本。这是我遇到的两个问题：（我添加了一些关于我尝试过的评论）

<% content_for(:head) do %>
<script type="text/javascript">
    $(document).ready(function() {
        $('.button-print-ticket').click(function(e) {
            e.preventDefault();
            var header = $('.social-header');
            header.queue(function() {
              var search_string ='#map-canvas img[src=https://maps.gstatic.com/mapfiles/google_white.png]';
              var glink = $(search_string).parent().parent();
              glink.replaceWith(glink.html());
              $(this).dequeue();
            });
            header.hide();
            header.queue(function() {
              window.print();
              $(this).dequeue();
            });
            header.queue(function() {
              $('.social-header').show();
              $(search_string).parent().replaceWith(glink);
              $(this).dequeue();
            });
        });
    });
</script>
<script type="text/javascript">
//an alert here works
if(screen.width >= 800) {
  //an alert here works too
  $(document).ready(function() {
    //an alert here only works in the console
    $(document).ready(function(){
      $('#overlay').fadeIn('fast',function(){
          $('#box').animate({'top':'160px'},500);
      });
    });
    $('#boxclose, #bt-fbshare, #bt-tweet, #bt-email').click(function(){
        $('#box').hide("drop", { direction: "up" }, 100, function(){
            $('#overlay').fadeOut('fast');
        });
    });
    $(document).keyup(function(e) {
      if (e.keyCode == 27){
         $('#box').hide("drop", { direction: "up" }, 100, function(){
             $('#overlay').fadeOut('fast');
         });
      }
    });

  });
}
</script>
<% end %>

我还包括了 Ruby On Rails 标记，因为这是我能辨别的唯一区别。（JS 显示在 Firebug 中）我的onload标签<body>中也没有。另一个奇怪的是它曾经可以工作，我不记得对这些脚本中的任何一个进行过任何更改。

编辑2：另一件事：我也可以放在console.log($)前面if (screen-width >= 800)，它告诉我这$是一个函数。

编辑：这是生成的 HTML：

<head>
<style type="text/css">@media print {  .gmnoprint {    display:none  }}@media screen {  .gmnoscreen {    display:none  }}</style>
<title>Web Page</title>

<meta content="text/html;charset=UTF-8" http-equiv="content-type"/>
<meta content="ALL" name="robots"/>
<meta content="5 Days" name="revisit-after"/>
<meta content="EN" name="language"/>
<meta charset="utf-8"/>
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
<meta name="viewport" content="width=device-width, initial-scale = 1.0, maximum-scale = 1.0"/>


<link type="text/css" rel="stylesheet" media="screen, projection, print" href="/stylesheets/screen.css?1347374478"/>
<link type="text/css" rel="stylesheet" media="screen, projection, print" href="/stylesheets/global.css?1346943598"/>
<link type="text/css" rel="stylesheet" media="print" href="/stylesheets/print.css?1343928684"/>

<!--[if lt IE 9]>
<script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->

<!--[if lte IE 7]><link href="/stylesheets/ie7.css?1343928684" media="screen, projection" rel="stylesheet" type="text/css" /><![endif]-->
<!--[if !IE]><link href="/stylesheets/media.css?1343928684" media="screen, projection" rel="stylesheet" type="text/css" /><![endif]-->

<script type="text/javascript" src="/javascripts/jquery.min.js?1343928684"></script>
<script type="text/javascript" src="/javascripts/jquery.ui.min.js?1343928684"></script>
<script type="text/javascript" src="/javascripts/jquery.ajax-submit.js?1343928684"></script>
<script type="text/javascript" src="/javascripts/modernizr-2.js?1343928684"></script>
<script type="text/javascript" src="/javascripts/date.format.js?1343928684"></script>
<script type="text/javascript" src="/javascripts/geo.js?1343928684"></script>
<script type="text/javascript" src="/javascripts/spin.min.js?1343928684"></script><style></style>
<script type="text/javascript" src="/javascripts/application.js?1347326686"></script>
<script type="text/javascript" src="/javascripts/global.js?1345692570"></script>

<script type="text/javascript">
    var logged_in = true;

    $(function() {
        if (logged_in) {
            $('.signed-in').show();
            $('.signed-out').hide();
        } else {
            $('.signed-in').hide();
            $('.signed-out').show();
        }

        $('.sign-out-link').click(function(e) {
            e.preventDefault();
            $('.signed-in').hide();
            $('.signed-out').show();
            logged_in = false;e
            window.location='/customers/destroy_session';
        });
    });
</script>
<!--<script type="text/javascript">

document.write(unescape("%3Cscript src='" + ((document.location.protocol=="https:")?"https://snapabug.appspot.com":"http://www.snapengage.com") + "/snapabug.js' type='text/javascript'%3E%3C/script%3E"));</script><script type="text/javascript">

SnapABug.addButton("--------","0","55%");

</script>-->

<style type="text/css">
    #map-canvas { width : 100%; height: 100%; }
</style>
<script src="https://maps.googleapis.com/maps/api/js?v=3&amp;sensor=true" type="text/javascript"></script><script type="text/javascript" src="https://maps.gstatic.com/intl/en_us/mapfiles/api-3/9/14/main.js"></script>
<script src="/javascripts/google.maps.styled-marker.js" type="text/javascript"></script>
<script type="text/javascript">

    var directionsDisplay;  
    var directionsService = new google.maps.DirectionsService();
    var venueMarker = new google.maps.Marker;
    var pu_map;

    var map;
    $(function() {
        var latlng = new google.maps.LatLng(40.256676, -111.644755);
        var mapOptions = {
            zoom                : 13,
            center              : latlng,
            mapTypeId           : google.maps.MapTypeId.ROADMAP,
            disableDefaultUI    : true,
            zoomControl         : true
        };
        map = new google.maps.Map(document.getElementById("map-canvas"), mapOptions);

        new google.maps.Marker({
            position : latlng,
            map : map
        });

    });

    $(function() {
        directionsDisplay = new google.maps.DirectionsRenderer();
        var latlng = new google.maps.LatLng(40.256676, -111.644755);
        var mapOptions = {
            zoom                : 13,
            center              : latlng,
            mapTypeId           : google.maps.MapTypeId.ROADMAP,
            disableDefaultUI    : true,
            zoomControl         : true
        };
        pu_map = new google.maps.Map(document.getElementById("popup_map_cont"), mapOptions);
        directionsDisplay.setMap(pu_map);
    });

</script>



<script type="text/javascript">
    $(document).ready(function() {
        $('.button-print-ticket').click(function(e) {
            e.preventDefault();
            var header = $('.social-header');
            header.queue(function() {
                var search_string ='#map-canvas img[src=https://maps.gstatic.com/mapfiles/google_white.png]';
                var glink = $(search_string).parent().parent();
                glink.replaceWith(glink.html());
                $(this).dequeue();
            });
            header.hide();
            header.queue(function() {
                window.print();
                $(this).dequeue();
            });
            header.queue(function() {
                $('.social-header').show();
                $(search_string).parent().replaceWith(glink);
                $(this).dequeue();
            });
        });
    });
</script>
<script type="text/javascript">
    if(screen.width >= 800) {
        $(document).ready(function() {
            $(document).ready(function(){
                $('#overlay').fadeIn('fast',function(){
                    $('#box').animate({'top':'160px'},500);
                });
            });
            $('#boxclose, #bt-fbshare, #bt-tweet, #bt-email').click(function(){
                $('#box').hide("drop", { direction: "up" }, 100, function(){
                    $('#overlay').fadeOut('fast');
                });
            });
            $(document).keyup(function(e) {
                if (e.keyCode == 27){
                    $('#box').hide("drop", { direction: "up" }, 100, function(){
                        $('#overlay').fadeOut('fast');
                    });
                }
            });

        });
    }
</script>

<script type="text/javascript" charset="UTF-8" src="https://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/9/14/%7Bcommon,util,marker%7D.js"></script><script type="text/javascript" charset="UTF-8" src="https://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/9/14/%7Bmap%7D.js"></script><script type="text/javascript" charset="UTF-8" src="https://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/9/14/%7Bonion%7D.js"></script><script type="text/javascript" charset="UTF-8" src="https://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/9/14/%7Bcontrols%7D.js"></script><script type="text/javascript" charset="UTF-8" src="https://maps.gstatic.com/cat_js/intl/en_us/mapfiles/api-3/9/14/%7Bstats%7D.js"></script><script async="true" type="text/javascript" src="http://a.adroll.com/j/roundtrip.js"></script>

4

1 回答 1

0

也许您应该尝试将所有 JS 代码放在同一个标​​记脚本和 $(document).ready() 函数中

<% content_for(:head) do %>
<script type="text/javascript">
    $(document).ready(function() {
        $('.button-print-ticket').click(function(e) {
            e.preventDefault();
            var header = $('.social-header');
            header.queue(function() {
              var search_string ='#map-canvas img[src=https://maps.gstatic.com/mapfiles/google_white.png]';
              var glink = $(search_string).parent().parent();
              glink.replaceWith(glink.html());
              $(this).dequeue();
            });
            header.hide();
            header.queue(function() {
              window.print();
              $(this).dequeue();
            });
            header.queue(function() {
              $('.social-header').show();
              $(search_string).parent().replaceWith(glink);
              $(this).dequeue();
            });
        });
        if(screen.width >= 800) {
            $('#overlay').fadeIn('fast',function(){
                $('#box').animate({'top':'160px'},500);
            });
            $('#boxclose, #bt-fbshare, #bt-tweet, #bt-email').click(function(){
                $('#box').hide("drop", { direction: "up" }, 100, function(){
                    $('#overlay').fadeOut('fast');
                });
            });
            $(document).keyup(function(e) {
                if (e.keyCode == 27){
                    $('#box').hide("drop", { direction: "up" }, 100, function(){
                        $('#overlay').fadeOut('fast');
                    });
                }
            });
         }
    });
</script>
<% end %>

正如 marteljn 评论，请务必在 head 部分引用 JQuery

<script type="text/javascript" src="jquery.js"></script>

如果它仍然不起作用，您可以按照 jfriend00 的建议发布generetad HTML。

于 2012-09-13T00:47:11.633 回答