已被CORS策略阻止

最新推荐文章于 2025-05-14 17:48:08 发布

mrzblog

最新推荐文章于 2025-05-14 17:48:08 发布

阅读量5.6k

点赞数

CC 4.0 BY-SA版权

文章标签： javascript html5 jquery html

本文链接：https://blog.csdn.net/mrzblog/article/details/109505771

博客讨论了在JavaScript中遇到的CORS(Cross-Origin Resource Sharing)策略阻止数据请求的问题，强调了HTML5和jQuery在跨域请求时可能遇到的挑战。内容描述了预期的正常响应情况，即在没有CORS限制时，输入关键字能够像百度搜索那样实时显示相关结果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

为什么打印之后是这样的，也不是跨域，点进api也有数据，就是一直报这种错，有没有大神能帮帮解决一下

正常的话应该返回数据就成这样的跟百度一样输入关键字可以出来下面的这种在这里插入图片描述

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<!-- <script src="./js/jquery-1.12.4.min.js"></script> -->
<script src="http://www.htmleaf.com/js/jquery/2.1.1-rc2/jquery.js"></script>
<!-- <script src="http://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script> -->
    <link href="https://cdn.bootcss.com/twitter-bootstrap/3.4.1/css/bootstrap.min.css" rel="stylesheet">
<body>
<input type="text" name="batch" placeholder="设备号" class="form-control" id="batch"  list="batch_list" autocomplete="off">
<!-- 选择内容 -->
<datalist id="batch_list">
</datalist>
<!-- 动态加载选择的内容 -->
<script>
    $('input#batch').bind('keyup', function () {
        var batch = $('input#batch').val();
        $.ajax({
            url: "http://xxxxxx",
            type: "GET",
            dataType: 'json',
            crossDomain: true,
            data: {'MdTitle': batch},//MdTitle查询需要的参数
            async: false,
            success: function (arg) {
                $('datalist#batch_list').empty();
                for (var i = 0; i < arg.length; i++) {
                    var add_options = '<option value="' + arg[i] + '">'+ arg[i] + '</option>';
                    $('datalist#batch_list').append(add_options);
                }
            }
        })
    });
</script>
</body>
</html>