函数未在HTML文件中定义

所以,我倾向于先在html文件中创建一个脚本,然后在我知道它有效时将其移动到javascript文件中……但是,现在它返回一个未定义的。

这是我的HTML:

<div class="tab">
  <button class="tablinks" onclick="openAction(event, 'battle-wrapper')" id="defaultOpen">Battle</button>
  <button class="tablinks" onclick="openAction(event, 'tradeskill-wrapper')">Trade Skills</button>
  <button class="tablinks" onclick="openAction(event, 'crafting-wrapper')">Crafting</button>
</div>

这是我的javascript:

var storedUsername;

// Port Connect Cht
if (window.location.hostname == '****' || window.location.hostname == '****') {
  var port = 443;
} else {
  var port = 8080;
}

var connected = false;
var socket = io.connect(window.location.hostname + ':' + port, { 'connect timeout': 5000 });

// Connection Successful
socket.on('connect', function () {
  connected = true;
  // socket.emit('login');
});

socket.on('disconnect', function () {
  connected = false;
});

$(document).on('click', 'button#btn-logout', function () {
  socket.emit('logout');
});

socket.on('not logged', function (destination) {
  window.location.href = destination;
});

socket.on('start up', function (dataObj) {

});

$(document).ready(function (dataObj) {
  $('#battle-wrapper').on('click', 'button#battlebutton', function (event) {
    event.preventDefault();
    socket.emit('fight mob', $('#monster').val());
  });

  socket.on('mob test', function (dataObj) {
    if (dataObj.userStats) {
      $('#player-stats').html(dataObj.userStats);
      $('#mob-stats').html(dataObj.mobStats);
      $('#fight-results').html(dataObj.results);
      $('span#action-counter').html(dataObj.autos);
      $('#title').html(dataObj.autos + ' - KoG');
    } else {
      $('#title').html('AUTOS EXPIRED - KoG');
    }

  });

  $('#generalChat').click(function () {
    $('#chat').toggle();
  });

  var current = '#actions';

  // Actions Button Handler
  $('#btn-actions').click(function () {
    if (current != '#actions') {
      $(current).hide();
      current = '#actions';
      $(current).show();
    }
  });

  // Profile button handler
  $('#btn-profile').click(function () {
    if (current != '#profile') {
      $(current).hide();
      current = '#profile';
      $(current).show();
    }
  });

  // Kingom button handler
  $('#btn-kingdom').click(function () {
    if (current != '#kingodm-page') {
      $(current).hide();
      current = '#kingdom-page';
      $(current).show();
    }
  });

  // inventory button handler
  $('#btn-inventory').click(function () {
    if (current != '#inventory') {
      $(current).hide();
      current = '#inventory';
      $(current).show();
    }
  });

  //  allicne button handler
  $('#btn-alliance').click(function () {
    if (current != '#alliance') {
      $(current).hide();
      current = '#alliance';
      $(current).show();
    }
  });

  // mail button handler
  $('#btn-mail').click(function () {
    if (current != '#mail') {
      $(current).hide();
      current = '#mail';
      $(current).show();
    }
  });

  // Statistics Handler
  $('#statistic-row').load('statistics.ejs', function () {
    socket.on('time', function (data) {
      $('#time').html(data);
    });

    socket.on('users online', function (usersConnected) {
      $('#online').html(usersConnected);
    });
  });
});

// Chat Handler
$('#chat').load('chat.ejs', function () {

  $('#chat-form').submit(function (event) {
    event.preventDefault();

    var msg = $('#m').val();

    // Clears chat field
    $('#m').val('');

    // Discards message if not connected
    if (!connected || msg == '') {
      return false;
    }

    socket.emit('chat', msg, storedUsername);
  });

  // Populat chat
  socket.on('message', function (message, username) {
    storedUsername = username || storedUsername;
    $('#messages').prepend($('<li>').html(message));
  });

  // Get the element with id="defaultOpen" and click on it
  document.getElementById('defaultOpen').click();

  function openAction(evt, actionName) {
    // Declare all variables
    var i; var tabcontent; var tablinks;
    console.log(actionName);

    // Get all elements with class="tabcontent" and hide them
    tabcontent = document.getElementsByClassName('tabcontent');
    for (i = 0; i < tabcontent.length; i++) {
      tabcontent[i].style.display = 'none';
    }

    // Get all elements with class="tablinks" and remove the class "active"
    tablinks = document.getElementsByClassName('tablinks');
    for (i = 0; i < tablinks.length; i++) {
      tablinks[i].className = tablinks[i].className.replace(' active', '');
    }

    // Show the current tab, and add an "active" class to the button that opened the tab
    document.getElementById(actionName).style.display = 'block';
    evt.currentTarget.className += ' active';
  }
});

**相关功能结束 现在我知道,当脚本在html文件中时,它本身也可以工作。我正确地包含了我的js文件,因为它使用了很多其他的东西,而且它们可以工作。但由于某些原因,这个功能是唯一不起作用的。

编辑:以下是完整控制台错误:

Uncaught ReferenceError: openAction is not defined
    at HTMLButtonElement.onclick (game:66)
    at HTMLDivElement.<anonymous> (game.js:152)
    at HTMLDivElement.<anonymous> (jquery.min.js:4)
    at Function.each (jquery.min.js:2)
    at r.fn.init.each (jquery.min.js:2)
    at Object.<anonymous> (jquery.min.js:4)
    at i (jquery.min.js:2)
    at Object.fireWith [as resolveWith] (jquery.min.js:2)
    at A (jquery.min.js:4)
    at XMLHttpRequest.<anonymous> (jquery.min.js:4)

编辑:我添加了我的整个js文件,也许你们中的一个可以发现一个我不能发现的错误。 **** 我想审查的事情。