ajax的使用（实现省、市、区的选择）

最新推荐文章于 2024-09-14 11:06:39 发布

三月.'

最新推荐文章于 2024-09-14 11:06:39 发布

阅读量79

点赞数

分类专栏：题目 / 例子详解功能实现文章标签： ajax javascript html Powered by 金山文档

本文链接：https://blog.csdn.net/qq_56715703/article/details/128978311

版权

功能实现同时被 2 个专栏收录

15 篇文章 0 订阅

订阅专栏

题目 / 例子详解

13 篇文章 0 订阅

订阅专栏

数据库表单为：（数据在一个表上）

html代码为：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <h2>请选择省市</h2>
    <select name="" id="provinice"></select>
    <select name="" id="city"></select>
    <select name="" id="qu"></select>
</body>
</html>

jquery编写步骤：

先引入在线jquery

<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>

编写sendAjax() 方法

{ url, type = "get", data = null, dataType = "json" } 使用了解构赋值。

return new Promise() 返回一个promise对象，并且在(resolve, reject)中返回promise对象异步操作后返回的数据。

    function sendAjax({ url, type = "get", data = null, dataType = "json" }) {
        return new Promise((resolve, reject) => {
            $.ajax({
                url: url,
                type: type,
                data: data,
                dataType: dataType,
                success(res) {
                    resolve(res)
                },
                error(errText) {
                    reject(errText)
                }
            })
        })
    }