Ajax简单实例(基于jQuery)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8"/>
    <title></title>
    <script src="js/jquery-1.8.3.min.js"></script>
    <script type="text/javascript">
        $(function () {
            $("#cmbProvince").on("change", function () {
                var selectIndex = $('#cmbProvince option:selected').val();//选中的值
                var name = $('#cmbProvince option:selected').text();//选中的值
                console.info(selectIndex);
                var provice = {
                    id: selectIndex,
                    name: name
                }˙
                $.ajax({
                    url: "http://localhost:8080/Ajax/linkage",
                    data: JSON.stringify(provice),
                    type: "POST",
                    dataType: "json",
                    success: function (data) {
                        console.info(data);
                        var size = data.length;
                        var optionstring = "";
                        for (var i = 0; i < size; i++) {
                            var item = data[i];
                            optionstring += "<option value='" + item.id + "' >" + item.name + "</option>";
                        }
                        $("#cmbCity").html(optionstring);
                    },
                    error: function (e) {
                        alert("请求处理出错");
                    }
                });
            });
        });
    </script>
</head>
<body>
<select id="cmbProvince" name="cmbProvince">
    <option value="0">请选择省份</option>
    <option value="1">江苏省</option>
    <option value="2">山东省</option>
</select>
<select id="cmbCity" name="cmbCity">
    <option value="0">请选择城市</option>
</select>
</body>
</html>

 

posted @ 2017-09-22 14:57  喵嘻嘻  阅读(705)  评论(0编辑  收藏  举报