问题:在下载最后一个.js文件之前,Jquery Slider不会显示在网页上
问题:如何在外部.js仍在加载时显示Jquery Slider(已完成Jquery下载,并下载其他第三方插件和模块)。
情景:
<html>
<head>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.1/jquery-ui.js"></script>
<link rel="stylesheet" href="http://jqueryui.com/resources/demos/style.css" />
<script type="text/javascript">
$(document).ready( function() {
// Product Price Slider
$(function() {
$("#fproductprice #slider-range").slider({
range: true,
logarithmic: true,
min: 1,
max: 100 ,
animated: true,
values: [1, 100],
slide: function( event, ui ) {
$("#fppricefrom").val(ui.values[0]);
$("#fppriceto").val(ui.values[1]);
}
});
$("#fppricefrom").val( $("#fproductprice #slider-range").slider("values",0));
$("#fppriceto").val( $("#fproductprice #slider-range").slider("values",1));
});
});
</script>
</head>
<body>
<!-- Product Price -->
<div id="fproductprice">
Price:
<div id="slider-range"></div>
<br />
<input type="text" id="fppricefrom" size="8"/>
<input type="text" id="fppriceto" size="8"/>
</div>
<script type="text/javascript" src="//assets.pinterest.com/js/pinit.js"></script>
</body>
</html>
答案 0 :(得分:0)
答案 1 :(得分:0)
尝试通过jQuery getScript $.getScript
$(function() {
$("#fproductprice #slider-range").slider({
range: true,
logarithmic: true,
min: 1,
max: 100 ,
animated: true,
values: [1, 100],
slide: function( event, ui ) {
$("#fppricefrom").val(ui.values[0]);
$("#fppriceto").val(ui.values[1]);
}
});
$("#fppricefrom").val( $("#fproductprice #slider-range").slider("values",0));
$("#fppriceto").val( $("#fproductprice #slider-range").slider("values",1));
$.getScript('//assets.pinterest.com/js/pinit.js', function() { });
});