-1

我正在尝试使用 ajax(单击按钮)在 HTML 页面内进行简单的 Web API 调用。但那个电话总是失败。问题仅在于该 API 的 ajax(单击按钮)调用。在组合框中加载非常好。所以,我希望它不应该是一个跨域问题。

以下是导致问题的代码:

<body>

    <a class="offline-button" href="../index.html">Back</a>
    <input id="btnSayHello" type="button" value="Get Value From Ajax" /><br />

    <div id="example" class="k-content">

        <div class="demo-section">
            <h2>Products</h2>
            <input id="products" style="width: 250px" />
        </div>

        <script>
            $(document).ready(function() {
                $("#products").kendoDropDownList({
                    //dataTextField: "Name",
                    //dataValueField: "Name",
                    dataTextField: "ProductName",
                    dataValueField: "ProductID",
                    dataSource: {
                        transport: {
                            read: {
                                dataType: "jsonp",
                                url: "http://demos.kendoui.com/service/Products",
                            }
                        }
                    }
                });
            });

            $(function () {

                $("#btnSayHello").click(function () {
                    $.ajax({
                        type: "GET",
                        contentType: "jsonp",
                        //contentType: "application/json; charset=utf-8",
                        dataTypes: "jsonp",
                        processdata: true,
                        data: {},
                        url: "http://demos.kendoui.com/service/Products",
                        success: function (data) {
                            alert("Success");
                        },
                        error: function (result) {
                            window.alert(result.responseText);
                        }
                    });
                })
            });
        </script>

对于按钮单击的 Ajax 调用的responseText它返回“未定义”

文档就绪功能的相同 URL 调用工作正常。并填充该ComboBox

源代码可在此链接中找到。

提前感谢大家的帮助!

4

2 回答 2

1

你可以看到这个,我认为它解决了你的问题,尝试使用回调发送一些重复的值作为查询参数。

$(document).ready(function(){
       $("#btnSayHello").click(function () {
                    $.ajax({
                        type: "GET",
                        url: "http://demos.kendoui.com/service/Products?callback=123",
                        dataType: "jsonp",
                        success: function (data) {
                            alert("Success"+JSON.stringify(data));
                        },
                        error: function (result) {
                           alert("error:"+result.responseText);
                        }
                    });


        });
      });

http://jsfiddle.net/nPeaV/7370/

于 2013-09-23T11:26:20.633 回答
0

好的,我得到了答案,问题是因为“ dataTypes ”关键字。我将其更改为“ dataType ”并且它起作用了。

好吧,我是 Web 技术的新手,最初我尝试在“dataTypes”工作得很好的 aspx 页面中开发相同的代码。因此,我尝试在普通的 HTML 文件中使用相同的代码库,但没有成功。

因此,结论是,与HTML5相比, aspx页面中的“ dataTypes ”可能有一些不同的处理方式。

于 2013-09-24T05:18:46.633 回答