ajax传值

来源：互联网发布：名片设计模板软件下载编辑：程序博客网时间：2024/05/29 18:30

1.规范

  <script src="/jquery/jquery-1.8.3.js"></script>    <script type="text/javascript">        $(function () {           var flag=false;          var  flag1=false;            $("#houseNum").blur(function() {                $("#s1").empty();               houseNum=$(this).val();                if(houseNum==null||houseNum==""){                    var span = $("<span id='s1'>*房产编号不可为空*</span>");                    $(this).after(span);                    flag= false;                }else {                    flag= true;                }            });            $("#houseName").blur(function() {                $("#s2").empty();               houseName=$(this).val();                if(houseName==null||houseName==""){                    $("#s2").html("房产名称不可为空！");                    flag1= false;                }else {                    flag1= true;                }            });            $("button").click(function() {                if(flag1&&flag){                    $.ajax({                        type:"post",                        url:"${pageContext.request.contextPath }/house/addHouse.action",                        data:{                            houseNum:houseNum,                            houseName:houseName                        },                        dataType:"json",                        success:function (data) {                            if(data.flag==1){                             alert("添加成功！");                                window.location.href="/house/selHouse.action";                            }else {                                alert("添加失败，用户名不能重！");                            }                        },                        error:function () {                            alert("系统繁忙，请稍候再试！");                        }                    });                }else {                    alert(flag+":"+flag1);                    alert("输入信息不能为空！");                }            });        });    </script></head><body><p2>添加页面</p2><br/>    房产编号 : <input type="text" name="houseNum" id="houseNum" /><br/>    房产名称: <input type="text" name="houseName" id="houseName" /><span id="s2"></span><br/>   <button>添加</button></body>

2.示范

<html><head>    <title>Title</title>    <script src="/jquery/jquery-1.8.3.js"></script>    <script>        function checkAll() {            $("input[id='features2']").each(                function () {                    if($(this).prop("checked")){                        $(this).removeAttr("checked");                    }else {                        $(this).prop("checked","true");                    }                });        }        function batchHouse() {            var checkedNum = $("input[name='features']:checked").length;            if(checkedNum == 0) {                alert("请选择至少一项！");                return;            }            if(confirm("确定要删除所选项目？")) {                var checkedList=[];                $("input[name='features']:checked").each(function () {                    checkedList.push($(this).val());                });                ids=checkedList.toString();                $.ajax({                    type:"get",                    url:"/house/batchHouse.action",                    data:{                        ids:ids                    },                    dataType:"json",                    success:function (data) {                            alert(data.flag);                            location.href="/house/selHouse.action";                            location.reload();                    },                    error:function () {                        alert("出现错误，稍后再试！");                    }                });            }        }    </script></head><body><p2>展示页面</p2><br/><form action="/house/fuzzyHouse.action" method="post">模糊查询房产名：<input type="text" name="houseName"/>    可输入房产编号查询 ： <input type="text" name="houseNum"/><br/>    <input type="submit" value="查询"/></form><input type="button" value="全选/全不选" id="hide" onclick="checkAll()"/><input type="button" value="批量删除" onclick="batchHouse()"/><table border="1">    <tr>        <td>复选框</td>        <td>房产id</td>        <td>房产编号</td>        <td>房产名称</td>    </tr>    <c:forEach items="${houseList}" var="house">        <tr>            <td> <input type="checkbox" id="features2" name="features" value="${house.id}"/></td>            <td> <a href="/house/selHouseById.action?id=${house.id}">${house.id}</a></td>            <td><a href="/house/selHouseById.action?id=${house.id}">${house.houseNum}</a></td>            <td><a href="/house/selHouseById.action?id=${house.id}">${house.houseName}</a></td>        </tr>    </c:forEach></table></body></html>

3.下拉框

<select name="customerId" id="s2" onchange="s1()">    <option value="">请选择</option>    <c:forEach items="${customerList}" var="customer">        <option value="${customer.id}">${customer.customerName}</option>    </c:forEach></select><br/>

<script>        function s1() {            var price=  $("#s2").val();            alert(price+"gogog");        }    </script>

4.修改

<form action="/student/updateStudent.action" method="post">    <input type="hidden" name="id" value="${stu.id}" /><br/>    请输入学生姓名：  <input type="text" name="tname" value="${stu.tname}" /><br/>    请输入学生地址： <input type="text" name="address" value="${stu.address}"/><br/>    请输入学生性别： <input type="text" name="gender" value="${stu.gender}"/><br/>    请输入学生学院名称： <input type="text" name="cname" value="${stu.cname}"/><br/>    <input type="submit" value="修改"/></form>

阅读全文

0 0