将Javascript从html移动到外部文件

时间:2013-06-14 15:15:08

标签: javascript

我无法使用一些我试图从内联转换为外部JavaScript文档的JavaScript。我试图在外部放置的这段代码不起作用。

// JavaScript Document
function homepage() {
    $("#button").click(function(){
        $("#main, #nav").slideToggle();
        if($(this).html() == "-"){
            $(this).html("+");
            setTimeout(function() {
                $('#wrapper').css('top', 'auto');
                $('#wrapper').animate({ 'bottom': '0' }, 500);
            }, 500);
        } else {
            $(this).html("-");
            setTimeout(function() {
                $('#wrapper').animate({ 'top': '0' }, 500);
                $('#wrapper').css('bottom', 'auto');
            }, 500);
        }
    });
}

3 个答案:

答案 0 :(得分:1)

尝试锁定脚本,以便:

$(document).ready(function(){
  // JavaScript Document
  function homepage() {
  $("#button").click(function(){
  $("#main, #nav").slideToggle();
  if($(this).html() == "-"){
      $(this).html("+");
      setTimeout(function() {
        $('#wrapper').css('top', 'auto');
        $('#wrapper').animate({ 'bottom': '0' }, 500);
      }, 500);
  }
  else{
      $(this).html("-");

      setTimeout(function() {
          $('#wrapper').animate({ 'top': '0' }, 500);
          $('#wrapper').css('bottom', 'auto');
      }, 500);
  }
  });}

});

答案 1 :(得分:0)

我认为它“无效”,因为你的jQuery选择器失败了。将您的代码放在$(function () {...})内,以确保它在DOM-ready上运行。

答案 2 :(得分:0)

您的代码让我假设您正在使用jQuery。要将使用jQuery之类的库的JS文件移动到外部文件,您必须执行以下步骤:

如果代码在jQuery中,看起来像这样:

$(document).ready(function(){
    // here is all your code
});

然后你必须将所有内容(包括$(document).ready();部分)移动到外部文件中,并且(最好)将其加载到html页面的底部。