0

我的 KendoUI 自动完成示例适用于 Chrome，但不适用于 Firefox。

我可以输入城镇名称，例如“沃特福德”，并获得以 chrome 显示的结果。

使用 FireBug，我可以看到我返回了有效的 JSON 结果，但得到了“TypeError：e is undefined”错误消息。

http://jsfiddle.net/franH/znkV3/14/

var app = new kendo.mobile.Application(document.body, {

transition: 'slide'
});

$(document).ready(function() {
$("#autoComplete").kendoAutoComplete({
    minLength: 7,
    dataTextField: "title",
    filter: "contains",
    placeholder: "Select town...",
    animation: {
        open: {
            effects: "fadeIn",
            duration: 2000,
            show: true
        }
    },

    close: function(e) {
        var str1 = "Dropdown Item Selected:" + " " + e.item;
        alert(str1);
    },
    dataSource: new kendo.data.DataSource({
        transport: {
            read: {
                url: "http://api.geonames.org/wikipediaSearchJSON",
                data: {
                    q: function() {
                        return $("#autoComplete").data("kendoAutoComplete").value();
                    },
                    maxRows: 10,
                    username: "pete"

                }
            }
        },
        schema: {
            data: "geonames"
        }
    }),
    change: function() {
        this.dataSource.read();
    }
    })
});
4

3 回答 3

1

您好，您正在从同源策略不允许的另一个域请求json。但是默认情况下，Chrome 并不关心这一点，这就是它仍然有效的原因。

由于您不能强制用户更改他们的浏览器设置，我建议您搜索jsonp端点或其他支持它的服务。

于 2012-12-05T21:23:09.713 回答
1

我看到的唯一问题是事件没有这样的e.item事情close。使用 value 方法获取自动完成的值。

于 2012-12-05T20:24:22.517 回答
0

通过添加行让它在 FireFox 中工作

datatype: "jsonp",

更新了示例小提琴：http: //jsfiddle.net/franH/znkV3/15/

var app = new kendo.mobile.Application(document.body, {
  transition: 'slide'
});

$(document).ready(function() {
  $("#autoComplete").kendoAutoComplete({
    minLength: 7,
    dataTextField: "title",
    filter: "contains",
    placeholder: "Select town...",
    animation: {
        open: {
            effects: "fadeIn",
            duration: 2000,
            show: true
        }
    },

    close: function(e) {
        var str1 = "Dropdown Item Selected:" + " " + e.item;
        alert(str1);
    },
    dataSource: new kendo.data.DataSource({
        transport: {
            read: {
                url: "http://api.geonames.org/wikipediaSearchJSON",
                dataType: "jsonp",
                data: {
                    q: function() {
                        return $("#autoComplete").data("kendoAutoComplete").value();
                    },
                    maxRows: 10,
                    username: "pete"

                }
            }
        },
        schema: {
            data: "geonames"
        }
    }),
    change: function() {
        this.dataSource.read();
    }
  })
});
于 2012-12-06T12:05:55.280 回答