我一直在做一些简单的事情,但我无法找到解决方案。 我有一张桌子:
第一列是文章代码,第二列是描述,其他列是文章所在的商店和它们的安装。 每次我查看一个数量(数量)我都会向PHP脚本发出ajax请求。 我甚至不会解释脚本会做什么,因为我只是强行给我一个默认值,只是为了调试。
当我将查看该单元格时,我将显示带有产品图像的工具提示(我强制图像也用于调试),并在图像下方显示文本(强制ajax响应)。 我的问题是,有时它会显示带有强制图像的工具提示,但不显示强制的ajax响应。它给了我一个空洞的回应。
在开始时,一切正常,然后它开始在几个特定的细胞上做,然后我刷新,我开始在其他细胞。 我无法理解这种行为(如果您想尝试,请将表添加为示例,并填充控制台日志以检查一切是否正常)。
<html>
<head>
<!-- dataType: "json", -->
<title></title>
<style>
img{border:none;}
#tooltip{
position:absolute;
border:1px solid #ccc;
background:#333;
padding:5px;
display:none;
color:#fff;
}
</style>
<script type="text/javascript" src="http://code.jquery.com/jquery-2.0.3.min.js"></script>
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.9.2/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("td").mouseover(function(){
var magazzino = ""; //store
var codice = ""; //code
var quantita = 0; //quantity
var row = $(this).parent().index('tr');
var col = ($(this).index('tr:eq('+row+') td'));
var cord = $(this).offset();
console.log("row: "+row+" col: "+col);
console.log("left: "+cord.left+ " top: "+cord.top);
quantita = $.trim($(this).text());
codice = $.trim($("table > tbody > tr:eq("+row+") > td.cod").text());
magazzino = $.trim($("table > tbody > tr:first-child > td:eq("+col+")").text());
console.log("the code is': "+codice+ "the store is': "+magazzino);
if(quantita > 0){ $.ajax({
url: 'ajax.php',
type: 'GET',
data: {magazzino:magazzino , codice:codice},
success: function(result){
$("body").append("<p id='tooltip'><img src='http://www.w3.org/Icons/valid-xhtml10-blue' alt='ajax' /></br>"+ result +"</p>");
$("#tooltip")
.css("top",( cord.top + 20) + "px")
.css("left",( cord.left + 20) + "px")
.fadeIn(400);
console.log("it get in here! will it show the result?: "+result);
}
});
}
});
$("td").mouseout(function(){
$('#tooltip').remove();
});
});
</script>
</head>
<body>
<table border="1">
<tr>
<td class="left cod" title="">Codice_articolo</td>
<td class="center desc" title="">Descrizione</td>
<td class="center GM" title="">GM</td>
<td class="center GR" title="">GR</td>
<td class="center AM" title="">AM</td>
<td class="center DM" title="">DM</td>
<td class="wrap GD" title="">GD</td>
</tr>
<tr>
<td class="left cod" title="">bsd555</td>
<td class="center desc" title="">router</td>
<td class="center GM" title="">0</td>
<td class="center GR" title="">0</td>
<td class="center AM" title="">1</td>
<td class="center DM" title="">4</td>
<td class="wrap GD" title="">0</td>
</tr>
<tr>
<td class="left cod" title="">alfa456</td>
<td class="center desc" title="">macchina</td>
<td class="center GM" title="">0</td>
<td class="center GR" title="">0</td>
<td class="center AM" title="">0</td>
<td class="center DM" title="">2</td>
<td class="wrap GD" title="">0</td>
</tr>
<tr>
<td class="left cod" title="">rityui765</td>
<td class="center desc" title="">router</td>
<td class="center GM" title="">1</td>
<td class="center GR" title="">2</td>
<td class="center AM" title="">0</td>
<td class="center DM" title="">0</td>
<td class="wrap GD" title="">0</td>
</tr>
<tr>
<td class="left cod" title="">gefr5444</td>
<td class="center desc" title="">pc</td>
<td class="center GM" title="">2</td>
<td class="center GR" title="">0</td>
<td class="center AM" title="">1</td>
<td class="center DM" title="">4</td>
<td class="wrap GD" title="">0</td>
</tr>
<tr>
<td class="left cod" title="">koiuy</td>
<td class="center desc" title="">frigo</td>
<td class="center GM" title="">0</td>
<td class="center GR" title="">0</td>
<td class="center AM" title="">1</td>
<td class="center DM" title="">4</td>
<td class="wrap GD" title="">0</td>
</tr>
<tr>
<td class="left cod" title="">muiui899</td>
<td class="center desc" title="">cell</td>
<td class="center GM" title="">1</td>
<td class="center GR" title="">0</td>
<td class="center AM" title="">0</td>
<td class="center DM" title="">1</td>
<td class="wrap GD" title="">0</td>
</tr>
</table>
</body>
</html>