我正在使用脚本在我的网站上拖动图像,图像的位置我希望用PHP存储在MySQL数据库中。我的问题是我不知道如何打印javascript位置值,以便我可以将其插入数据库。其他一切都很好。我正在遵循的指南是:http://draggabilly.desandro.com/您可以查看最后一个跟踪位置并存储在变量中的示例。提前谢谢。
<div id="house_wall1">
<img src="x" class="draggie" style="position:relative; left:200px;">
<img src="x" class="draggie" style="position:relative;">
<img src="x" class="draggie" style="position:relative;">
<!--Cypyrights and many thanks to http://desandro.mit-license.org for element movements -->
</div>
<script type="text/javascript" src="js/draggabilly.pkgd.min.js"></script>
<script>
( function() {
var container = document.querySelector('#house_wall1');
var elems = container.querySelectorAll('.draggie');
for ( var i=0, len = elems.length; i < len; i++ ) {
var elem = elems[i];
new Draggabilly( elem, {
containment: true,
});
}
})();
function onDragMove( instance, event, pointer ) {
console.log( 'dragMove on ' + event.type +
pointer.pageX + ', ' + pointer.pageY +
' position at ' + instance.position.x + ', ' + instance.position.y );
}
// bind event listener
draggie.on( 'dragMove', onDragMove );
// un-bind event listener
draggie.off( 'dragMove', onDragMove );
// return true to trigger an event listener just once
draggie.once( 'dragMove', function() {
return true;
});
</script>
</div>
更新: 试图让ajax解析值并打印它以确保它有效:
function loadXMLDoc()
{
var xmlhttp;
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
{
dragEnd: true
}
}
xmlhttp.open("POST","post.php",true);
xmlhttp.send();
}