所谓的二级联动就是你点选一个按钮或者选择一个内容时,页面显示变化。以下代码只是一个非常简单的实现方式,仅仅作为参考。

 jquery代码:

 1 其中selectid是一个下拉菜单的id

 $().ready(function () {
$("#selectid").change(function () {
$("#selectid").empty();
var ov = $("#selectid").val();
$.post(
"ajax_func.php",//需要纯php代码,不要有html混杂
{role: ov},
function (data) {
var datas = JSON.parse(data);
          // 若jquery each报 Uncaught TypeError: Cannot use 'in' operator to search for错误,则需要JSON.parse(data)函数处理下传过来的数据
var shtml ="";
$.each(datas, function (k,v) {
shtml += "<label>" +v + "&nbsp;<input type='checkbox' name='vs[]' value='" + v + "'></label>";
});
$("#selectid").append(shtml);
}
);
});
});
服务器端php代码:
<?php
/**
* desc 处理ajax post
*/
if(isset($_POST['role'])){
$gamesIps = array('111','222','333');
echo(json_encode($gamesIps));
}

jquery $.post() 向php传值 实现简单的二级联动的更多相关文章

  1. 利用JS实现一个简单的二级联动菜单

    前几天在看js的相关内容,所以就简单写了一个二级联动菜单.分享一下. <!DOCTYPE html> <html lang="en"> <head&g ...

  2. 通同select便签实现简单的二级联动

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

  3. php简单实现二级联动

    <script type="text/javascript"> //当第一级选项发生变化的时候跳转 function jump() { location.href='? ...

  4. JS简单实现二级联动菜单

    <form method="post" action=""> 省/市:<select id="province" onch ...

  5. jq简单城市二级联动实现

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  6. jq实现简单的二级联动下拉框

    1 效果图 2 html <!DOCTYPE html> <html lang="en"> <head>     <meta charse ...

  7. jQuery 1.3.2 简单实现select二级联动

    jQuery 1.3.2 简单实现select二级联动  复制代码代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transiti ...

  8. vue 简单实现父组件向子组件传值,简单来说就是子组件肆意妄为的调用父组件里后台返回的值

    首先在于父子组件传值的方法很多,本人在这里只是简单描述一下一个组件里面引用了子组件,那么子组件如何才能获取父组件中后台返回的值呢? 首先调用组件相信大家都应该明白了(不明白的自己撸撸文档), < ...

  9. vue子组件与子组件之前传值-----最简单办法

    1.在main.js中定义一个值(红色为重点) new Vue({ el: '#app', data: { Bus: new Vue() }, router, store, render: h =&g ...

随机推荐

  1. [转帖]ssd固态硬盘的Trim命令是什么?

    ssd固态硬盘的Trim命令是什么?  收藏 分享 邀请 许多用户朋友在购买SSD的时候都会特别强调Trim,不过Trim是什么?做什么用的?   什么是Trim?   Trim指令也叫disable ...

  2. 使用Word 进行UTF8 以及字符串编码的转换操作

    1. 使用Word文档能够实现 字符串和utf8编码的转换. 快捷键是 ALT+X 在知乎的一个里面看到一个说法: ㍾ ㍽ ㍼ ㍻ - 这四个在Unicode表里是倒序排列的,而且只预留了这四个年号, ...

  3. swusec的构想,顺便送开学福利——校园网一号多登录演示

    前言: 我不是什么大牛,我只想通过我的努力,打造swu网络安全爱好者的圈子.期待你加入. swusec是什么? swusec (SouthWestUniversity SecurityTeam),西南 ...

  4. ACM数论之旅13---容斥原理(一切都是命运石之门的选择(=゚ω゚)ノ)

    容斥原理我初中就听老师说过了,不知道你们有没有听过(/≧▽≦)/ 百度百科说: 在计数时,必须注意没有重复,没有遗漏. 为了使重叠部分不被重复计算,人们研究出一种新的计数方法. 这种方法的基本思想是: ...

  5. java 常量 因为常量不依赖对象 所以一般都会将常量设置为 类属性

  6. 【刷题】BZOJ 5418 [Noi2018]屠龙勇士

    www.lydsy.com/JudgeOnline/upload/noi2018day2.pdf Solution 将攻击的式子列出来,\(atk \times x-p \times y=a_i\) ...

  7. 单点登录(十七)----cas4.2.x登录mongodb验证方式成功后返回更多信息更多属性到客户端

    我们在之前已经完成了cas4.2.x登录使用mongodb验证方式登录成功了.也解决了登录名中使用中文乱码的问题. 单点登录(十三)-----实战-----cas4.2.X登录启用mongodb验证方 ...

  8. BZOJ 4802 欧拉函数

    4802: 欧拉函数 Description 已知N,求phi(N) Input 正整数N.N<=10^18 Output 输出phi(N) Sample Input 8 Sample Outp ...

  9. linux 中 virtualenvwrapper的使用

    原文链接:http://www.jianshu.com/p/3abe52adfa2b Virtaulenvwrapper Virtaulenvwrapper是virtualenv的扩展包,用于更方便管 ...

  10. 使用tkinter做简单计算器

    代码如下: from tkinter import * #导入tkinter库 root =Tk() #给窗体 root.title('calculator') #设置窗体名字 frm=Frame(r ...