我建立了一个充满单元格的智能数据网格,它将识别(在模糊上)它们是否被更改,以及值是上升还是下降。
看上去是这样的。当用户悬停一个已更改的框并告诉他们页面第一次加载时值是什么时,就会出现灰色工具提示。
我想把它转换成一个Wijmo Grid,但是要保持相同的上下脚本,以显示何时以及如何更改值。但是,当我将表初始化为一个Wijmo网格时,我的脚本突然停止了在所有浏览器中运行。
问题:为什么会发生这种情况,有一个简单的解决方法吗?你不能用传统的jQuery和Javascript访问Wijmo单元吗?
(这里没有Widjmo的完整代码和工作示例):部分代码
<table id="data-grid">
<thead>
<tr>
<th>March</th>
<th>April</th>
<th>May</th>
</tr>
</thead>
<tbody>
<tr>
<td><input type="text" value="12000" /></td>
<td><input type="text" value="1000" /></td>
<td><input type="text" value="100000" /></td>
</tr>
这里是我当前的(这里没有Widjmo的完整代码和工作示例):代码
$(function() {
// Initializes data grid as a Widjmo Grid (currently commented out)
//$("#data-grid").wijgrid();
// Array to store the initial values in grid
var initialValues = [];
// Assigns an index ID to each cell in the grid
$('input').each(function(index) {
initialValues[index] = $(this).val();
$(this).data('id', index);
});
// Checks cell(s) for changes on blur (lose focus)
$("input").blur(function() {
var $t = parseInt($(this).val(), 10);
var $s = parseInt(initialValues[$(this).data('id')], 10);
// Value has changed
if($t != $s) {
var sign = "";
if($t-$s > 0) {
sign="+";
}
$(this).parent().children(".tooltip").remove();
$(this).parent().append("<div class='tooltip'>Initial " + $s + "<br/>Change " + sign + ($t-$s) + "</div>");
}
// Value is no different from intial value
if($t == $s) {
$(this).removeClass("up down");
$(this).parent().children(".tooltip").remove();
$(this).parent().children(".up-indicator, .down-indicator").remove();
}
// Value is greater than initial
else if($t > $s) {
$(this).removeClass("up down");
$(this).parent().children(".up-indicator, .down-indicator").remove();
$(this).addClass("up");
$(this).parent().append("<div class='up-indicator'></div>");
}
// Value is less than initial
else if($t < $s) {
$(this).removeClass("up down");
$(this).parent().children(".up-indicator, .down-indicator").remove();
$(this).addClass("down");
$(this).parent().append("<div class='down-indicator'></div>");
}
// Conpute the net change
netChange(initialValues);
});
// Displays tooltip of changed items
$("input").hover(function() {
$(this).parent().children(".tooltip").toggle();
});
// Computes the net change in the data grid
function netChange(initialValues) {
var runningTotal = 0;
$('input').each(function() {
runningTotal += parseInt($(this).val(), 10);
});
var intialTotal = 0;
for (var i = 0; i < initialValues.length; i++) {
intialTotal += parseInt(initialValues[i], 10);
}
var changes = $(".up, .down").length;
$("#items").text(changes + " Items");
$("#net").text("Net: " + (runningTotal - intialTotal));
}
});
发布于 2013-03-12 20:06:21
Wijmo插件代码在代码中使用$.browser.msie
,这是在jQuery 1.3中弃用的,在jQuery 1.9中完全删除。参见jQuery文档:http://api.jquery.com/jQuery.browser/和下面是粗体中关于为什么删除它的评论。
我们建议不要使用此属性;请尝试使用特性检测(请参阅jQuery.support)。在未来的jQuery.browser版本中,jQuery可能会被移动到插件中。
在我在小提琴中选择了早期版本的jQuery 1.8
之后,您的工具提示代码可以工作一次。
固定小提琴: http://jsfiddle.net/Fgdec/13/
在您的小提琴中,您选择了jQuery 1.9,它没有$.browser.msie
,所以它在铬控制台中抛出了下面的错误。
Uncaught TypeError: Cannot read property 'msie' of undefined jquery.wijmo-open.all.2.3.8.min.js:31
(anonymous function) jquery.wijmo-open.all.2.3.8.min.js:31
(anonymous function) jquery.wijmo-open.all.2.3.8.min.js:61
Uncaught TypeError: Cannot read property 'msie' of undefined jquery.wijmo-complete.all.2.3.8.min.js:34
(anonymous function) jquery.wijmo-complete.all.2.3.8.min.js:34
(anonymous function) jquery.wijmo-complete.all.2.3.8.min.js:34
https://stackoverflow.com/questions/15145048
复制相似问题