它有时会随机中断,有时会起作用,有时则不会。它出什么问题了?
这是我的代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, initial-scale=1 user-scalable=0" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/1.1.1/jquery.mobile-1.1.1.min.js"></script>
<script src="my.js">
</script>
</head>
<body>
<!-- Home -->
<div data-role="page" id="one">
<div data-theme="c" data-role="header">
<h3>Friends School</h3>
</div>
<div data-role="content" style="padding: 15px">
<div data-role="fieldcontain">
<input type="submit" id="selectbutton" data-theme="b" data-icon="arrow-r" data-iconpos="right" value="Choose Name" />
</div>
<input type="submit" id="button" data-theme="a" data-icon="alert" disabled="disabled" data-iconpos="top" value="Check-In" />
<small style="display: none;">Not activating? Try going closer to the Upper School office. If still not working just go to the office and check-in manually</small>
</div>
</div>
<div data-role="page" id="two" data-theme="a">
<div data-theme="c" data-role="header">
<h3>Select Name</h3>
</div>
<div data-role="content" data-theme="a">
<ul data-role="listview" data-filter="true" data-filter-placeholder="Search people..." data-filter-theme="d"data-theme="d" data-divider-theme="d">
<li data-role="list-divider">A</li>
<li><a name="personname" href="#">Adam Kinkaid</a></li>
<li><a name="personname" href="#">Alex Wickerham</a></li>
<li><a name="personname" href="#">Avery Johnson</a></li>
<li data-role="list-divider">B</li>
<li><a name="personname" href="#">Bob Cabot</a></li>
<li data-role="list-divider">C</li>
<li><a name="personname" href="#">Caleb Booth</a></li>
<li><a name="personname" href="#">Christopher Adams</a></li>
<li><a name="personname" href="#">Culver James</a></li>
<li data-role="list-divider">D</li>
<li><a name="personname" href="#">David Walsh</a></li>
<li><a name="personname" href="#">Drake Alfred</a></li>
<li data-role="list-divider">E</li>
<li><a name="personname" href="#">Elizabeth Bacon</a></li>
<li><a name="personname" href="#">Emery Parker</a></li>
<li><a name="personname" href="#">Enid Voldon</a></li>
<li data-role="list-divider">F</li>
<li><a name="personname" href="#">Francis Wall</a></li>
<li data-role="list-divider">G</li>
<li><a name="personname" href="#">Graham Smith</a></li>
<li><a name="personname" href="#">Greta Peete</a></li>
<li data-role="list-divider">H</li>
<li><a name="personname" href="#">Harvey Walls</a></li>
<li data-role="list-divider">M</li>
<li><a name="personname" href="#">Mike Farnsworth</a></li>
<li><a name="personname" href="#">Murray Vanderbuilt</a></li>
<li data-role="list-divider">N</li>
<li><a name="personname" href="#">Nathan Williams</a></li>
<li data-role="list-divider">P</li>
<li><a name="personname" href="#">Paul Baker</a></li>
<li><a name="personname" href="#">Pete Mason</a></li>
<li data-role="list-divider">R</li>
<li><a name="personname" href="#">Rod Tarker</a></li>
<li data-role="list-divider">S</li>
<li><a name="personname" href="#">Sawyer Wakefield</a></li>
</ul>
</div>
</div><!-- /page two -->
<script>
var tries = 0;
function check(){
//alert('d');
if(tries>4){
first=true;
$("small").fadeIn(3000);
//alert("In")
}
else{
$("small").fadeOut(3000);
}
navigator.geolocation.getCurrentPosition( function(loc){
var lat1 = 39.35691630053478;
var lon1 = -76.62641812613514;
//var lat1 = 39.4354312;
//var lon1 = -76.6642454;
var lat2 = loc.coords.latitude;
var lon2 = loc.coords.longitude;
var radlat1 = Math.PI * lat1/180
var radlat2 = Math.PI * lat2/180
var radlon1 = Math.PI * lon1/180
var radlon2 = Math.PI * lon2/180
var theta = lon1-lon2
var radtheta = Math.PI * theta/180
var dist = Math.sin(radlat1) * Math.sin(radlat2) + Math.cos(radlat1) * Math.cos(radlat2) * Math.cos(radtheta);
dist = Math.acos(dist)
dist = dist * 180/Math.PI
dist = dist * 60 * 1.1515
if(dist < 0.06){
$('#button').button('enable');
tries = 0;
//$( "#button" ).text("Check-In");
$('#button').buttonMarkup({ icon: "star" });
}
else{
//$("#button" ).text("Not on campus.");
tries += 1;
$('#button').button('disable');
$('#button').buttonMarkup({ icon: "alert" });
}
//alert(dist);
});
$('#button').button('refresh');
}
var id = setInterval("check()",2000);
$( "#button" ).bind( "click", function(event, ui) {
$('#button').buttonMarkup({ icon: "check" });
$('#button').button('disable');
$( "#button" ).text("Checked in.");
$('#button').button('refresh');
window.clearInterval(id);
//$.mobile.changePage("#two", "flip", true, false);
});
$( "#selectbutton" ).bind( "click", function(event, ui) {
//alert('d');
$.mobile.changePage("#two", "slide", true, false);
});
$( "[name=personname]" ).bind( "click", function(event, ui) {
//alert($(this).html());
$("#selectbutton").prop('value', $(this).html());
$('#selectbutton').button('refresh');
$.mobile.changePage("#one", "slide", true, false);
});
</script>
</body>
</html>
这是什么问题,有时有效,有时无效。
然而它适用于 JSFiddle:http: //jsfiddle.net/5e4ue/
我在同一服务器上的两个不同域上进行了尝试,有时它在一个服务器上运行,但在另一个服务器代码相同的域上运行。出来像