相同的代码在jsfiddle但不会在我的服务器上运行？ [英] Same code on jsfiddle but won't run on my server?
问题描述
我很困惑。我只是试图测试一个jquery（simpleselect），并得到它的工作正常jquery，但然后当我上传到我的服务器...完全不工作！我发布了相同的代码，但也许新鲜的眼睛可以帮助。
I'm so confused. I'm just trying to test out a jquery (simpleselect) and got it working fine on jquery, but then when I upload it to my server... totally doesn't work! I swear its the same code but maybe fresh eyes can help. What am I missing here?
这是我上传的代码：
<html>
<head>
<link rel="stylesheet" type="text/css" href="https://smartieparts.com/bootstrap/includes/templates/bootstrap/css/stylesheet_jquery.simpleselect.min.css" />
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
<script type="text/javascript" src="https://smartieparts.com/bootstrap/includes/templates/bootstrap/jscript/jscript_jquery.simpleselect.min.js"></script>
<script type="text/javascript">
$("#currency-select").simpleselect({
fadingDuration: 500,
containerMargin: 100,
displayContainerInside: "document"
});
</script>
</head>
<body id="indexHomeBody">
<select name="currency" id="currency-select">
<option value="USD">USD</option>
<option value="EUR">EUR</option>
<option value="GBP">GBP</option>
<option value="CAD">CAD</option>
<option value="AUD">AUD</option>
<option value="CHF">CHF</option>
<option value="CZK">CZK</option>
<option value="DKK">DKK</option>
<option value="HKD">HKD</option>
<option value="JPY">JPY</option>
<option value="NZD">NZD</option>
<option value="NOK">NOK</option>
<option value="PLN">PLN</option>
<option value="SGD" selected="selected">SGD</option>
<option value="SEK">SEK</option>
<option value="ILS">ILS</option>
<option value="MXN">MXN</option>
<option value="TWD">TWD</option>
<option value="PHP">PHP</option>
<option value="THB">THB</option>
</select>
</body>
</html>
这里是 JSfiddle
请注意，JSfiddle有外部css和js资源，我从上面的代码复制/粘贴。
Note that the JSfiddle has external css and js resources that I exactly copy/pasted from the code above.
在JSfiddle页面上，下拉列表格式化并具有淡入淡出效果。在我的服务器上，它有些格式化，没有褪色。
On the JSfiddle page, the drop down is formatted and has a fade effect. On my server, it is somewhat formatted and has no fade.
我已将文件上传到我的服务器，以便您可以检查。 链接
I've uploaded the file to my server so you can check. Link
推荐答案
在文档准备就绪之前，无法安全操作页面。 jQuery检测到这个准备状态为你。包含在
$（document）.ready（）中的代码只会在页面文档对象模型（DOM）准备好执行JavaScript代码时运行。包含在$（window）.load（function（）{...}）中的代码将会运行一次整个页面（图片或iframe），而不仅仅是DOM准备。
A page can't be manipulated safely until the document is "ready." jQuery detects this state of readiness for you. Code included inside
$( document ).ready()will only run once the page Document Object Model (DOM) is ready for JavaScript code to execute. Code included inside$( window ).load(function() { ... })will run once the entire page (images or iframes), not just the DOM, is ready.
将您的代码包装在文档就绪处理程序。
Wrap your code in document-ready handler.
指定一个函数以便在DOM完全加载时执行。
Specify a function to execute when the DOM is fully loaded.
<script>
$(function() {
// Handler for .ready() called.
$("#currency-select").simpleselect({
fadingDuration: 500,
containerMargin: 100,
displayContainerInside: "document"
});
});
</script>
这篇关于相同的代码在jsfiddle但不会在我的服务器上运行？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
