<!DOCTYPE html>

<html>

<head>

    <title></title>

    <script src="../jquery/jquery.min.js" type="text/javascript" charset="utf-8"></script>

</head>

<script type="text/javascript">

    $(function(){

        // $("select[name='projectName']")

      $("#projectName").change(function(event) {

          /* Act on the event */

            $("#projectName").find('option:selected').text();

      var projectId=$("#projectName").find('option:selected').val();

   $.ajax({

                  url:'package_usb_submit.php',

                  type: 'post',

                  dataType: 'text',

                  data:'contents='+projectId,

                  success: function (data) {

                          // console.log(data)

                          var jsonObj=eval("("+data+")");

                          // console.log(jsonObj);

                          // console.log(jsonObj['content']);

                          var jsonArr=jsonObj['content'];

                          var option;

                          $("#version").empty();

                          for (var i = 0; i<jsonArr.length; i++) {

                                  console.log(jsonArr[i].desc);

                                 option = $("<option>").val(jsonArr[i].ver).text(jsonArr[i].desc);

                              $("#version").append(option);

                          }

                      }

                  })

           })

      });

    // })

</script>

<body>

   <div align="center">

    <form action="package_usb_submit.php" method="get" accept-charset="utf-8">

       <table>

           <tbody>

               <tr>

                   <td>打包版本:</td>

                   <td>

                   <select name="projectName" id="projectName">

                    <?php

                      for ($i=0; $i <3 ; $i++) {

                          echo "<option value='$i'>";

                          echo  "$i";

                          echo "</option>";

                      }

                    ?>

                    </select>

                   </td>

                   <td>

                    <select name='version' id='version'>

                        <?php

                          for ($i=0; $i <5 ; $i++) {

                                   echo "<option value='$i'>";

                                  echo  "$i";

                                  echo "</option>";

                          }

                        ?>

                    </select>

                   </td>

        </tr>

           </tbody>

       </table>

       <input type="submit" name="" value="OK">

    </form>

   </div>

</body>

</html>

后台数据返回:

<?php 

  // print_r($_REQUEST);

   switch ($_REQUEST['contents']) {

       case 0:

           echo '{"content":[{"ver":"10","desc":"abc"},{"ver":"12","desc":"abcd"}] }';

           break;

       case 1:

           echo '{"content":[{"ver":"1","desc":"abc"},{"ver":"2","desc":"abcd"}] }';

           break;

       default:

           # code...

           break;

   }

?>

ajax异步提交数据动态更改select选项的更多相关文章

  1. jQuery选取所有复选框被选中的值并用Ajax异步提交数据

    昨天和朋友做一个后台管理系统项目的时候涉及到复选框批量操作,如果用submit表单提交挺方便的,但是要实现用jQuery结合Ajax异步提交数据就有点麻烦了,因为我之前做过的项目中基本上没用Ajax来 ...

  2. JQuery中使用FormData异步提交数据和提交文件

    web中数据提交事件是常常发生的,但是大多数情况下我们不希望使用html中的form表单提交,因为form表单提交会中断当前浏览器的操作并且会调到另一个地址(即使这个地址是当前页面),并且会重复加载一 ...

  3. ajax异步获取数据后动态向表格中添加数据(行)

    因为某些原因,项目中突然需要做自己做个ajax异步获取数据后动态向表格中添加数据的页面,网上找了半天都没有 看到现成的,决定自己写个例子 1.HTML页面 <!doctype html> ...

  4. ASP.NET MVC 网站开发总结（五）——Ajax异步提交表单之检查验证码

    首先提出一个问题:在做网站开发的时候,用到了验证码来防止恶意提交表单,那么要如何实现当验证码错误时,只是刷新一下验证码,而其它填写的信息不改变? 先说一下为什么有这个需求:以提交注册信息页面为例,一般 ...

  5. AJAX异步提交，浏览器总跳出下载界面

    问题: 我在写一个网页的“用户登录”部分时,要将用户名和密码传到后端验证,想在前端用了AJAX异步提交功能,将 用户名密码传到后端,然后后端返回验证结果.但AJAX写好后每次刷新网页都会跳出下载窗口, ...

  6. Ajax异步提交登录(2)--登录使用

    http://cjp1989.iteye.com/blog/1740964 1.Ajax的原理: Ajax的原理就是:通过javascript的方式,将前台数据通过xmlhttp对象传递到后台,后台在 ...

  7. ajax 异步 提交 含文件的表单

    1.前言 需求是使用 jquery 的 ajax 异步提交表单,当然,不是简单的数据,而是包含文件数据的表单.于是我想到了 new FormData() 的用法, 可是仍然提交失败,原来是ajax的属 ...

  8. ASP模拟POST请求异步提交数据的方法

    这篇文章主要介绍了ASP模拟POST请求异步提交数据的方法,本文使用MSXML2.SERVERXMLHTTP.3.0实现POST请求,需要的朋友可以参考下 有时需要获取远程网站的某些信息,而服务器又限 ...

  9. 09.VUE学习之watch监听属性变化实现类百度搜索栏功能ajax异步请求数据,返回字符串

    cmd下安装axios npm install axios 安装好后,会多出node_modules文件夹 思路: 监听data里的word改变时,发送ajax异步请求数据, 把返回的数据赋值给dat ...

随机推荐

  1. Ubuntu回收站

    以前删除文件经常Move to trash,今天想清空发现根本不知道回收站在哪里,囧.遂Google之,于是发现在 -/.local/share/Trash目录下. 打开目录看看有什么东西: ➜ ~ ...

  2. 关于adb连接手机offline的问题解决

    win7-64位系统.对于windows系统,adb devices 显示offline一般可能有两个原因: 1 )端口被占用. 解决方式是:查找端口号,结束占用进程: adb nodaemon se ...

  3. 第5.5次Scrum会议

    会议信息 时间:2016.10.25 21:30 时长:0.5h 地点:大运村1号公寓5楼楼道 类型:日常Scrum会议 会议内容 鉴于团队推进受阻,原PM 邓 与 原后端 冯 协商后决定之后一段时间 ...

  4. HTTPS原理

    谣言粉碎机前些日子发布的<用公共WiFi上网会危害银行账户安全吗?>,文中介绍了在使用HTTPS进行网络加密传输的一些情况,从回复来看,争议还是有的.随着网络越来越普及,应用越来越广泛,一 ...

  5. css中关于居中的那点事儿

    css中关于居中的那点事儿 关于居中,无论是水平居中,还是垂直居中都有很多方式,下面我来介绍一些常用的. 第一部分:水平居中 1.实现行内元素的居中.方法:在行内元素外面的块元素的样式中添加:text ...

  6. LDA（主题模型算法）

    LDA整体流程 先定义一些字母的含义: 文档集合D,topic集合T D中每个文档d看作一个单词序列< w1,w2,...,wn >,wi表示第i个单词,设d有n个单词.(LDA里面称之为 ...

  7. python实现软件的注册功能（机器码+注册码机制）

    http://www.cnblogs.com/cquptzzq/p/5940583.html 一.前言: 目的:完成已有python图像处理工具的注册功能 功能:用户运行程序后,通过文件自动检测认证状 ...

  8. JSP传统标签开发

    1.标签技术的API类继承关系 1).JspTag接口是所有自定义标签的父接口 该接口中没有任何属性和方法,只有两个直接子接口,Tag接口和SimpleTag接口,把实现Tag接口的自定义标签叫做传统 ...

  9. javascript字符串截取的substring、substr和slice

    本文详细的介绍了javascript中substring().substr()和slice()三个JS字符串截取的方法,substring()方法用于提取字符串中介于两个指定下标之间的字符.subst ...

  10. tomcat 无法加载js和css 等静态文件的问题

    前段时间做了个网站,在本地tomcat测试都没有问题,但是部署到阿里云上之后,系统样式全没了.jsp等动态页面访问正常. 打开浏览器监控发现所有的css 和js 文件返回都是404 .直接访问单个的c ...