Home  >  Article  >  Web Front-end  >  Ajax simple example (based on jQuery)

Ajax simple example (based on jQuery)

一个新手
一个新手Original
2017-09-29 09:49:031135browse


<!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 = $(&#39;#cmbProvince option:selected&#39;).val();//选中的值
                  var name = $(&#39;#cmbProvince option:selected&#39;).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=&#39;" + item.id + "&#39; >" + 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>

The above is the detailed content of Ajax simple example (based on jQuery). For more information, please follow other related articles on the PHP Chinese website!

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn