关于jquery ui：jQ UI对话框的敲除init请求空数据：Chrome中的URL

Knockout init of jQ UI Dialog requests empty data: URL in Chrome

在使用jQuery 1.8.2，jQuery UI 1.8.23和Knockout 2.2.0的页面上，Google Chrome版本24.0.1312.52 m出现错误。当我加载页面时，有一个对URL的失败的HTTP请求，该URL只是GET data: HTTP/1.1，它是通过初始化jQuery UI对话框的语句生成的(有关代码，请参见文章底部)。该页面工作正常，但是这会导致在状态栏和JS控制台中显示错误，并且我想避免吓到我的用户。该错误不会出现在IE 9或FireFox 15.0.1中，但会出现在Safari 5.1.7(Windows)中。在Chrome Inspector中，错误的调用堆栈如下所示：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41

GET data: jquery.min.js:2
a.getComputedStyle.bH jquery.min.js:2
p.extend.css jquery.min.js:2
bZ jquery.min.js:2
b$ jquery.min.js:2
p.fn.extend.show jquery.min.js:2
p.each.p.fn.(anonymous function) jquery.min.js:2
a.fn.extend.show jquery-ui.min.js:5
a.widget._create._renderAxis jquery-ui.min.js:5
a.widget._create jquery-ui.min.js:5
a.Widget._createWidget jquery-ui.min.js:5
a.widget.a.(anon function).(anon function) jquery-ui.min.js:5
a.widget.bridge.a.fn.(anonymous function) jquery-ui.min.js:5
p.extend.each jquery.min.js:2
p.fn.p.each jquery.min.js:2
a.widget.bridge.a.fn.(anonymous function) jquery-ui.min.js:5
a.widget._makeResizable jquery-ui.min.js:5
a.widget._create jquery-ui.min.js:5
a.Widget._createWidget jquery-ui.min.js:5
a.widget.a.(anon function).(anon function) jquery-ui.min.js:5
a.widget.bridge.a.fn.(anonymous function) jquery-ui.min.js:5
p.extend.each jquery.min.js:2
p.fn.p.each jquery.min.js:2
a.widget.bridge.a.fn.(anonymous function) jquery-ui.min.js:5
ko.bindingHandlers.jqDialog.init QualityWalkViewModel.js:78
b.j.W knockout-2.2.0.js:11
g knockout-2.2.0.js:43
b.j knockout-2.2.0.js:45
W knockout-2.2.0.js:10
X knockout-2.2.0.js:12
Y knockout-2.2.0.js:12
X knockout-2.2.0.js:12
Y knockout-2.2.0.js:12
X knockout-2.2.0.js:12
b.Ca knockout-2.2.0.js:58
registerVM 3896:378
(anonymous function) 3896:362
p.Callbacks.k jquery.min.js:2
p.Callbacks.l.fireWith jquery.min.js:2
p.extend.ready jquery.min.js:2
D jquery.min.js:2

它在三个地方引用了我的脚本：

1
2
3

ko.bindingHandlers.jqDialog.init QualityWalkViewModel.js:78
registerVM 3896:378
(anonymous function) 3896:362

3896是页面的名称(它是URL的ID段，例如/WalkThrough/Edit/3896)。来自引用行的代码是：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27

(anonymous function) 3896:362
360 <script type="text/javascript">
361 $( function() {
362 registerVM(); <--- here

registerVM 3896:378
374 <script type="text/javascript">
375 var vm; // debug
376 function registerVM() {
377 vm = new QualityWalkViewModel( initialQualityWalkData );
378 ko.applyBindings( vm ); <--- here
379 }

QualityWalkViewModel.js:78
68 ko.bindingHandlers.jqDialog = {
69 init: function( element, valueAccessor ) {
70 var options = ko.utils.unwrapObservable( valueAccessor() ) || {};
71
72 // handle disposal
73 ko.utils.domNodeDisposal.addDisposeCallback( element, function() {
74 $( element ).dialog('destroy');
75 });
76
77 // init the dialog
78 $( element ).dialog( options ); <--- here
79 }
80 };

最后一个脚本是一个自定义绑定处理程序，用于初始化jQuery UI对话框，该对话框从http://jsfiddle.net/rniemeyer/WpnTU/改编而成，以响应JQuery对话框中的MVC Knockout JS。

如果我注释掉$( element ).dialog( options );行，该错误就会消失。知道为什么jQuery UI会生成一个空的data:网址并尝试请求它吗？

已修复。罪魁祸首是第260行附近jquery-ui.css中的data: url，该链接在http://bugs.jqueryui.com/ticket/7233上进行了一些讨论：

1	.ui-resizable-handle { background-image:url(data:); }

我不知道为什么他们比

更好

1	.ui-resizable-handle { background-image: none; }

这是我取代规则的原因，现在Chrome中没有页面错误。在某些时候，我需要在jQUI Bug Tracker中注册并发布更新。