JavaScript 和 jquery

落日映苍穹つ 2022-03-31 15:20 221阅读 0赞

1，城市省市级联

onchange事件：当改变下垃列表选项时执行
    add()方法：向下垃列表中添加一个选项
    options[]属性：返回包含下垃列表中的所有选项的一个数组
    selectedIndex属性：设置或返回下垃列表中被选中项的索引号

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
    <%@page isELIgnored="false"%>
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
    
    <html>
    <head>
        <script type="text/javascript">
            // 定义一个 省级 数组
            var searr=new Array("四川","湖南","广东")
            function init() {
                //获取第一个下垃列表元素
                var node=document.getElementById("seleOne");
                //遍历数组
                for (var i=0;i<searr.length;i++){
                    //把数组的值添加到下垃列表中
                    node.add(new Option(searr[i]));
                }
                //为每一个省级选项，赋值一个 城市级 的数组
                searr[0]=new Array("成都","宜宾","自贡");
                searr[1]=new Array("长沙","衡阳","常德");
                searr[2]=new Array("广州","深圳","珠海");
                //执行下面的seleId()方法
                seleId();
            }
            function seleId() {
                var nodeOne=document.getElementById("seleOne");
                //获取省级下垃列表中被选中选项的索引号
                var index=nodeOne.selectedIndex;
                var nodeTwo=document.getElementById("seleTwo");
                //城市级下垃列表 显示前把上一次显示的城市清除，以免重复显示
                nodeTwo.options.length=0;
                for (var i=0;i<searr[index].length;i++){
                    nodeTwo.add(new Option(searr[index][i]));
                }
            }
    
        </script>
    </head>
    <body onload="init()">
        <div>
            <select id="seleOne" onchange="seleId()">
            </select>
            <select id="seleTwo">
            </select>
        </div>
    </body>
    </html>

2，单选按钮

/* 获得单选按钮选中的值*/
     var state=$('input:radio[name="state"]:checked').val();
     
    /* 取消单选按钮的选中*/
    $('input:radio[name="state"]').attr("checked",false);

3，selected 列表

/* 获得列表选中的值*/
    var state=$("#selectState option:selected").val();

4，页面跳转

function back(id) { 
       /* 跳转到指定页面*/
       document.location = "${ctx}/oa/officeSupplies/supplies_receive_detail.jsp?status=detail&id="+id
    }else{  
       /* 返回上一页*/
       window.history.back(-1);
    }

5，只能为整数数字的正则

var sort = 10;
    var str = /^([0-9]|[1-9][0-9]*)$/;
    str.test(sort)

6，创建对象

var hisData = new Object();
    hisData.id = unitRangeId[i];
    hisData.name = unitRangeName[i];
    hisData.type = 1;

7，创建数组

var arr = new Array();
    arr[0] = hisData;

8，字符串与数组的转换

/* 字符串转成数组*/
    var unitRangeIds = "1,2,3,4,5";
    var unitRangeId = unitRangeIds.split(",");  // ["1", "2", "3","4","5"]
    var strs = "12345";
    var str = strs.split('');    // ["1", "2", "3","4","5"]
    
     /* 数组转成字符串*/
    var unitRangeNames = new Array(0,1,2,3,4);
    var unitRangeName1 =  unitRangeNames.join('');    // "01234"
    var unitRangeName2 =  unitRangeNames.join("");    // "0,1,2,3,4"
    var unitRangeName3 =  unitRangeNames.join("-");    // "0-1-2-3-4"

9，元素的显示与隐藏

/* 隐藏*/
    $("#name").hide();
     /* 显示*/
    $("#name").show();

10，input框只读

$("#name").attr("readonly","readonly");