Вопрос:
поэтому я чувствую (и надеюсь) это довольно просто. Я новичок в javascript и пытаюсь заставить это работать. Когда я ссылаюсь на мой внешний .js файл из моего html, он не работает. Однако при вводе кода script непосредственно в мой HTML он работает.
Вот файл js:
$(document).ready(function(){ $(«#flip»).click(function(){ $(«#panel»).slideToggle(«slow»); }); });
Это файл index.html:
<!DOCTYPE html> <html> <head> <title>slidepanel test</title> <script type=»text/javascript» src=»script.js»></script> <link rel=»stylesheet» type=»text/css» href=»style.css»/> </head> <body> <div id=»flip»>Click to slide the panel down or up</div> <div id=»panel»>Hello world!</div> </body> </html>
и это CSS:
#panel,#flip { padding:5px; text-align:center; background-color:#e5eecc; border:solid 1px #c3c3c3; } #panel { padding:50px; display:none; } Лучший ответ:
Вы используете jQuery, но похоже, что вы его не включили. Добавьте это в свой элемент HEAD
<script type=»text/javascript» src=»http://code.jquery.com/jquery-latest.js»></script> Ответ №1
Вам нужно импортировать jQuery.
<script type=»text/javascript» src=»http://code.jquery.com/jquery-latest.js»></script> Ответ №2
На самом деле, у меня была такая проблема, и я попробовал код ниже.
<head> <meta charset=»ISO-8859-1″> <title></title> <script type=»text/javascript» src=»http://code.jquery.com/jquery-latest.js»></script> </head> Ответ №3
У вас нет jquery в разделе <head>. Добавьте его перед тем, как добавить scripts.js. Только тогда ваш код будет работать.
<head> <title>slidepanel test</title> <link rel=»stylesheet» type=»text/css» href=»style.css»/> <script src=»//ajax.googleapis.com/ajax/libs/jquery/1.10.1/jquery.min.js»></script> <script type=»text/javascript» src=»script.js»></script> </head>
Если вы тестируете это на своем локальном компьютере, добавьте http в src или загрузите свою собственную копию jQuery.
И как в качестве побочного элемента, всегда лучше добавить stylesheets перед вашими файлами js.
Ответ №4
Похоже, вам не хватает jQuery. Включите его, прежде чем включать собственный код JavaScript.
Ответ №5
В вашем script содержится jQuery. Чтобы использовать его, у вас есть 2 варианта:
1. Загрузите его на свою веб-страницу:
- Загрузите производственную версию из jQuery.com
- В разделе <head></head> добавьте: <script src=»jquery-1.11.3.min.js»></script>
2. Включить jQuery из CDN:
- Вы можете использовать Google CDN, добавив следующее в раздел <head></head>:
<script src=»http://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js»></script>
Ответ №6
У меня похожая проблема. Ниже приведен код в двух файлах, который генерирует только белую пустую страницу, при выполнении кода не сообщается об ошибках, в чем проблема?
файл index.html:
<!DOCTYPE html> <html> <head> <title>Three.js</title> <style type = «text/css»> html, body {margin: 0; padding: 0; overflow: hidden} </style> </head> <body> <div id = «webgl»></div> <script src = «/lib/three.js»></script> <script src=»./main.js»></script> </html>
Файл main.js:
function init() { var scene = new THREE.Scene(); var box = getBox(1, 1, 1); var plane = getPlane(4); box.position.y = box.geometry.parameters.height/2; plane.rotation.x = Math.PI/2; scene.add(box); scene.add(plane); var camera = new THREE.PerspectiveCamera( 45, window.innerWidth/window.innerHeight, 1, 1000 ); camera.position.x = 1; camera.position.y = 2; camera.position.z = 5; camera.lookAt(new THREE.Vector3(0, 0, 0)); var renderer = new THREE.WebGLRenderer(); renderer.setSize(window.innerWidth, window.innerHeight); document.getElementById(‘webgl’).appendChild(renderer.domElement); renderer.render( scene, camera ); } function getBox(w, h, d) { var geometry = new THREE.BoxGeometry(w, h, d); var material = new THREE.MeshBasicMaterial({ color: 0x00ff00 }); var mesh = new THREE.Mesh( geometry, material ); return mesh; } function getPlane(size) { var geometry = new THREE.PlaneGeometry(size, size); var material = new THREE.MeshBasicMaterial({ color: 0xff0000, side: THREE.DoubleSide }); var mesh = new THREE.Mesh( geometry, material ); return mesh; } init();
