Question

我对外部javascript文件有问题。它不起作用

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

仅当我在页面末尾添加但我想添加<head>部分时，Ozel.js文件才能工作。问题是什么？你可以帮帮我吗？谢谢

<?php
include "connect.php";
session_start();
header('Content-Type: text/html; charset=utf-8');
?>
<head>
<link rel="shortcut icon" type="image/png" href="favicon.png"/>
<link rel="shortcut icon" type="image/png" href="favicon.png"/>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/ekko-lightbox/5.3.0/ekko-lightbox.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>

  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
  <script src="https://cdnjs.cloudflare.com/ajax/libs/ekko-lightbox/5.3.0/ekko-lightbox.min.js"></script>
  <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.0.12/css/all.css" integrity="sha384-G0fIWCsCzJIMAVNQPfjH08cyYaUtMwjJwqiRKxxE/rx96Uroj1BtIQ6MLJuheaO9" crossorigin="anonymous">
  <link rel="stylesheet" type="text/css" href="style.css">

<script>
$(document).on('click', '[data-toggle="lightbox"]', function(event) {
                event.preventDefault();
                $(this).ekkoLightbox();
                    lightbox.option({
      'resizeDuration': 200,
      'albumLabel': "Image %1 of %2"
    })
            });

function goBack() {
    window.history.back()
}
function goNext() {
    window.location.href='index.php'
}
</script>
</head>

Ozel.js

$("#gonderelim").click(function(){
    $("#rating").hide();
    $.ajax({ 
        type:"post",
        url:"voting.php",
        data:$("#voting").serialize(),
        success:function(cevap) {
            $("b").text(cevap);
        }
    })
    $("#stats").load("stats.php");
})

Answer 1

通常，当发生这种情况时，Java脚本部分中的代码将不会等待，直到整个主体加载完毕。出于同样的原因，您将javascript文件放在末尾，以允许html完全加载。解决此问题的另一种方法是，侦听https://developer.mozilla.org/en/docs/Web/Events/DOMContentLoaded事件被触发并在其中运行与DOM相关的操作。

在您的情况下，由于您已经在使用jQuery，因此只需在ozel.js代码周围添加

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

此块将在您的页面完成加载后开始

外部Javascript库不起作用

1 个答案: