在AJAX里 使用【 JSON 】 返回数据类型 实现简单的下拉菜单数据

时间：2022-01-16 06:07:58

在AJAX里 使用JSON返回数据类型 实现简单的下拉菜单数据

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<!--引用jquery代码包-->

<script src="../jquery-1.11.2.min.js"></script>

<title>无标题文档</title>

</head>

<select id="nation"></select>

<body>

<script type="text/javascript">

$.ajax({

    url:"JSON_chuli.php", //url跳转到指定的处理页面

    dataType:"JSON", //返回JSON数据类型，返回的是二维数组

    success: function(data){

        var str ="";  //先定义一个空的数组str

        /*for(var i=0;i<data.length;i++){

            str = str+"<option value='"+data[i].Code+"'>"+data[i].Name+"</option>";  //求data循环出来的索引[i]，取出Code列，显示出循环出来的Name列

        }*/

        for(var s in data){ //定义一个变量 s代表索引 in data初始值，进循环才有值

            str = str+"<option value='"+data[s].Code+"'>"+data[s].Name+"</option>"; //求data循环出来的索引[s]，取出Code列，显示出循环出来的Name列

        }

        $("#nation").html(str); //$("")找到下拉，将求出来的Name列值放到下拉列表中

    }

});

处理页面

<?php

include("../DBDA.class.php");//include关键字，纯处理页面引用封装好类的代码包

$db = new DBDA();  //造一个接受对象关键字new

$sql = "select * from nation"; //访问数据库查询nation表所有数据

//json_encode()此方法需要关联数组

//使用json_encode数组内容的编码格式必须是 utf8的

echo json_encode($db->GuanQuery($sql));  //调用引用表里的关联函数GuanQuery

?>

效果

在AJAX里 使用【 JSON 】 返回数据类型 实现简单的下拉菜单数据

在AJAX里 使用【 JSON 】 返回数据类型 实现简单的下拉菜单数据的更多相关文章

  1. 在AJAX里 使用【 XML 】 返回数据类型 实现简单的下拉菜单数据

    在AJAX里 使用XML返回数据类型 实现简单的下拉菜单数据 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN ...

  2. jsp中将后台传递过来的json格式的list数据绑定到下拉菜单select

    <span style="white-space:pre"> </span> <select><c:forEach var="f ...

  3. THINKPHP&lowbar;&lpar;5&rpar;&lowbar;THINKPHP6接收ajax下拉菜单提交的数据，存在的bug

    反思: 国产总是不尽人意,但是要支持国产. ThinkPHP的6接收ajax的post数据,存在一个bug.即ajax传递的json数据,在thinkphp后端解析出来后,并非直接的json格式. 描 ...

  4. ajax三级联动下拉菜单

    ajax写三级联动,先写一个文件类吧,以后用的时候直接调用即可: 来找一张表: 实现: 中国地域的三级联动:省.市.区: 图: 说一下思路: (1)当用户选择省份的时候触发事件,把当前的省份的id通过 ...

  5. 2016&sol;4&sol;5 Ajax ①用户名 密码 登陆 注册 ② 判断用户名是否已存在 ③点击按钮出现民族选项下拉菜单 ④DBDA类 加入Ajaxquery方法 数组变字符串 字符串拆分

    ①登陆   注册    查表匹配    0405Ajax.php   ②判断用户名是否存在 <!DOCTYPE html> <html lang="en"> ...

  6. Ajax跨域：Jsonp实例--百度搜索框下拉提示

    Ajax跨域:Jsonp实例--百度搜索框下拉提示 一.总结 一句话总结:a.找好接口:b.用script标签的src引入文件(json数据):c.定义及实现上一步引入文件中的函数 1.如何找到一个网 ...

  7. 【easyui-combobox】下拉菜单自动补全功能，Ajax获取远程数据源

    这个是针对easyUI的下拉菜单使用的,Ajax获取远程数据源 HTML 页面 <input id="uname" name="uname" class= ...

  8. php&plus;ajax的三级联动下拉菜单

    封装一个三级联动,就可以在任何页面进行引用了 先写个页面引用一下这个js <head> <meta http-equiv="Content-Type" conte ...

  9. 下拉框数据的动态选择，类似级联ajax刷新数据

    简单的两个下拉列表,第二个中的数据与第一个下拉框相关: --------------------var selected = $(this).children('option:selected').v ...

随机推荐

  1. 【编程题目】输入两个整数 n 和 m&comma;从数列 1&comma;2&comma;3&period;&period;&period;&period;&period;&period;&period;n 中 随意取几个数&comma; 使其和等于 m &period;&period;&period; &starf;

    第 21 题(数组)2010 年中兴面试题编程求解:输入两个整数 n 和 m,从数列 1,2,3.......n 中 随意取几个数,使其和等于 m ,要求将其中所有的可能组合列出来. 我的思路: 从小 ...

  2. 收集一些java相关的文章

    有些文章看了,以后想再看已经忘了在哪里了.故在此一一记录下那些值得看的文章. 1:如何确定Java对象的大小 中文版本 :http://article.yeeyan.org/view/104091/6 ...

  3. Charlie&&num;39&semi;s Change&lowbar;完全背包&amp&semi;&amp&semi;路径记录

    Description Charlie is a driver of Advanced Cargo Movement, Ltd. Charlie drives a lot and so he ofte ...

  4. PHP - 拒绝低版本PHP

    //判断PHP版本是否太低 if (PHP_VERSION < '4.1.0') { echo 'Version is to Low!'; exit; }

  5. TDD实践感悟

    每个开发者都想开发出高质量的代码,更少的Bug.更容易维护不仅让人心情愉悦,也让我们有更多时间去学习和生活. 少加一些班,多陪家人,:) 当开发任务非常简单时,比如基本的增删改查,可能使用怎样的方式开 ...

  6. unit test

    1) State vs Behaviour Verificationhttps://manas.tech/blog/2009/04/30/state-vs-behaviour-verification ...

  7. SpringMvc &plus; Jsp&plus; 富文本 kindeditor 进行 图片ftp上传nginx服务器 实现

    一:html 原生态的附件上传 二:实现逻辑分析: 1.1.1 需求分析 Common.js 1.绑定事件 2.初始化参数 3.上传图片的url: /pic/upload 4.上图片参数名称: upl ...

  8. 谈谈我对Linux系统学习的历程回顾

    ​​众所周知,Windows 和Linux 是目前最流行的2个操作系统.Windows系统适合普通用户,它的优势是图形化界面,简单易用,使用起来门槛很低,很容易上手,所以,windows占有了大多数普 ...

  9. oracle sum&lpar;x&rpar; over&lpar; partition by y ORDER BY z &rpar; 分析

    之前用过row_number(),rank()等排序与over( partition by ... ORDER BY ...),这两个比较好理解: 先分组,然后在组内排名. 今天突然碰到sum(... ...

  10. Redis入门到高可用（一）——初识Redis

    一.Redis是什么 * 开源 * 基于键值的存储服务系统 * 支持多种数据结构 * 高性能,功能丰富 二.Redis特性 ♦️ 概述 * 速度快 * 支持持久化 * 支持多种数据结构 * 支持多种编 ...

相关文章