Jquery学习(一)--------备忘

luozhangwen 2010-08-04 04:20:51

隔行变色效果



<html> 

<head> 

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

    <title>JQuery测试 </title> 

    <style type="text/css"> 

        

        /*table中偶数行*/ 

        .tabEven { 

            background: #cccccc; 

        }    

            

        /*table中奇数行*/        

        .tabOdd { 

            background: #ffffff; 

        } 

    </style> 

    <script language="javascript" src="jquery-1.3.2.min.js"> 

    </script> 

    <script language = "JavaScript" type="text/javascript"> 

        $(document).ready(function(){ 

            $("#tabTest tr:even").addClass("tabEven"); 

            $("#tabTest tr:odd").addClass("tabOdd"); 

        }); 

    </script> 

</head> 

<body> 

    <table id="tabTest"> 

            <tr> 

                <td>罗章文_1 </td> 

                <td>1 </td> 

            </tr> 

            <tr> 

                <td>罗章文_2 </td> 

                <td>2 </td> 

            </tr> 

            <tr> 

                <td>罗章文_3 </td> 

                <td>3 </td> 

            </tr> 



    </table> 

</body> 

</html>

...全文

56 2 打赏收藏转发到动态举报

写回复

用AI写文章

2 条回复

切换为时间正序

请发表友善的回复…

发表回复

山城忙碌人 2010-08-04

打赏
举报

Jquery学习(一)--------备忘

以后学JQUERY用

luozhangwen 2010-08-04

打赏
举报

Jquery+Json二级联动效果



<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"%>



<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

	<head>

	</head>

	<script type="text/javascript" src="jquery-1.3.2.min.js"></script>

	<script type="text/javascript">

         function change()

         {       

                 var param = encodeURI(encodeURI("中文"));

                 $.getJSON("QueryCityServlet?param="+param+"&id="+$("#province").val(),

                 function(data)

                 {

                   //var arrData = eval(data);

                   //alert(arrData[0].cityName + "~~~~~~~");

                    $("#city").html('');

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

                    {

                          $('#city').append($("<option></option>").attr("value",data[i].id).text(data[i].cityName)); 

                    }

                 }

             );

         }

     </script>

	<body>

		<select name="province" id="province" onchange="change()">

			<c:forEach items="${provinces}" var="province">

				<option value="${province.id}">

					${province.provName}

				</option>

			</c:forEach>

		</select>

		

		<select name="city" id="city">

		</select>

	</body>

</html>



        request.setCharacterEncoding("UTF-8");

        response.setCharacterEncoding("UTF-8");

        String param = URLDecoder.decode(request.getParameter("param"),"utf-8");

        System.out.println(param);

        PrintWriter out  = response.getWriter();



        JSONArray jsonArray = JSONArray.fromObject(resultArray);

        System.out.println(jsonArray);

        out.print(jsonArray.toString());  

        out.flush();

        out.close();