Question

我是网页设计的新手。我试图在下面的javascript代码中组合所有函数，但最终它们都不再有效。我用检查工具检查它显示语法错误，但我不知道我做错了什么。

$(document).ready(function() {
  {
    $('.img-zoom').hover(function() {
      {
        $(this).addClass('transition');

      },
      function() {
        $(this).removeClass('transition');
      }
    });



    {
      $('[data-toggle="tooltip"]').tooltip();
    });


  {
    var date_input = $('input[name="date"]'); //our date input has the name "date"
    var container = $('.bootstrap-iso form').length > 0 ? $('.bootstrap-iso form').parent() : "body";
    var options = {
      format: 'mm/dd/yyyy',
      container: container,
      todayHighlight: true,
      autoclose: true,
    };
    date_input.datepicker(options);
  });

{
  // Configure/customize these variables.
  var showChar = 50; // How many characters are shown by default
  var ellipsestext = "...";
  var moretext = "Show more >";
  var lesstext = "Show less";


  $('.more').each(function() {
    var content = $(this).html();

    if (content.length > showChar) {

      var c = content.substr(0, showChar);
      var h = content.substr(showChar, content.length - showChar);

      var html = c + '<span class="moreellipses">' + ellipsestext + '&nbsp;</span><span class="morecontent"><span>' + h + '</span>&nbsp;&nbsp;<a href="" class="morelink">' + moretext + '</a></span>';

      $(this).html(html);
    }

  });

  $(".morelink").click(function() {
    if ($(this).hasClass("less")) {
      $(this).removeClass("less");
      $(this).html(moretext);
    } else {
      $(this).addClass("less");
      $(this).html(lesstext);
    }
    $(this).parent().prev().toggle();
    $(this).prev().toggle();
    return false;
  });
});
});

$(window).scroll(function() {
  if ($(window).scrollTop() > 100) {
    $('nav').addClass('stuck');
  } else {
    $('nav').removeClass('stuck');
  }
});


$(".destination-menu li").sort(asc_sort).appendTo('.destination-menu');

//$("#debug").text("Output:");
// accending sort
function asc_sort(a, b) {
  return ($(b).text()) < ($(a).text()) ? 1 : -1;
}

// decending sort
function dec_sort(a, b) {
  return ($(b).text()) > ($(a).text()) ? 1 : -1;
}

//amChart.com for interactive map
var map = AmCharts.makeChart("mapdiv", {
  type: "map",
  theme: "dark",
  projection: "mercator",
  panEventsEnabled: true,
  backgroundColor: "transparent",
  backgroundAlpha: 1,
  zoomControl: {
    zoomControlEnabled: true
  },
  dataProvider: {
    map: "worldHigh",
    getAreasFromMap: true,
    areas: [{
      "id": "AT",
      "showAsSelected": true
    }, {
      "id": "AZ",
      "showAsSelected": true
    }, {
      "id": "CZ",
      "showAsSelected": true
    }, {
      "id": "DE",
      "showAsSelected": true
    }, {
      "id": "ES",
      "showAsSelected": true
    }, {
      "id": "FR",
      "showAsSelected": true
    }, {
      "id": "GB",
      "showAsSelected": true
    }, {
      "id": "IE",
      "showAsSelected": true
    }, {
      "id": "IT",
      "showAsSelected": true
    }, {
      "id": "NO",
      "showAsSelected": true
    }, {
      "id": "VA",
      "showAsSelected": true
    }, {
      "id": "CA",
      "showAsSelected": true
    }, {
      "id": "US",
      "showAsSelected": true
    }, {
      "id": "BR",
      "showAsSelected": true
    }, {
      "id": "AO",
      "showAsSelected": true
    }, {
      "id": "KE",
      "showAsSelected": true
    }, {
      "id": "NG",
      "showAsSelected": true
    }, {
      "id": "ZA",
      "showAsSelected": true
    }, {
      "id": "AE",
      "showAsSelected": true
    }, {
      "id": "CN",
      "showAsSelected": true
    }, {
      "id": "ID",
      "showAsSelected": true
    }, {
      "id": "IN",
      "showAsSelected": true
    }, {
      "id": "JP",
      "showAsSelected": true
    }, {
      "id": "KR",
      "showAsSelected": true
    }, {
      "id": "KW",
      "showAsSelected": true
    }, {
      "id": "OM",
      "showAsSelected": true
    }, {
      "id": "TW",
      "showAsSelected": true
    }, {
      "id": "HK",
      "showAsSelected": true
    }, {
      "id": "SG",
      "showAsSelected": true
    }, {
      "id": "AU",
      "showAsSelected": true
    }]
  },
  areasSettings: {
    autoZoom: true,
    color: "#B4B4B7",
    colorSolid: "#40E0D0",
    selectedColor: "#40E0D0",
    outlineColor: "transparent",
    rollOverColor: "#666",
    rollOverOutlineColor: "transparent"
  }
});


$('#nav li:has(ul)').doubleTapToGo();


var show_menu = document.querySelector('.show_menu_btn');

show_menu.addEventListener('click', function(event) {
  var target = document.querySelector(show_menu.getAttribute('data-target'));

  if (target.style.display == "none") {
    target.style.display = "block";
    show_menu.innerHTML = show_menu.getAttribute('data-shown-text');

  } else {
    target.style.display = "none";
    show_menu.innerHTML = show_menu.getAttribute('data-hidden-text');
  }
});

Answer 1

您错误地给出了悬停功能。它应该是这样的：

$('.img-zoom').hover(
  function() {
    $(this).addClass('transition');
  },
  function() {
    $(this).removeClass('transition');
  }
);

希望它有效：）

函数前的逗号导致语法错误

1 个答案: