jquery-ui以及js复习

最新推荐文章于 2024-04-21 14:50:35 发布

敢敢--

最新推荐文章于 2024-04-21 14:50:35 发布

阅读量340

点赞数

分类专栏： JS

本文链接：https://blog.csdn.net/yu9696/article/details/51052735

版权

JS 专栏收录该内容

9 篇文章 0 订阅

订阅专栏

(1).

</head>
<body>
<input type="button" οnclick="inpt()"value="show"/>
<div id="dialog-modal" title="遮罩层"></div>

<input type="text" id="txt" title="门前老树长新芽。。。"/>
</br></br></br></br></br></br></br></br></br></br></br></br></br></br></br>
</br></br>
<a href="jquery-1.10.2.js" id="a" οnclick="return true">点击超链接</a>
<span id="sp">我是按钮</span>
<script>

//    $(function() {
//        $( "#dialog-modal" ).dialog({
//            height: 140,
//            modal: true
//        });
//    });
$("input:button").click(function inpt(){
    $( "#dialog-modal" ).dialog({
        height: 140,
        modal: true,
        buttons: {
            关闭: function () {
                $(this).dialog("close");
            }
        }
    });
});

//    $(function() {
//        $( "#dialog-modal" ).dialog({
//            height: 140,
//            modal: true,
//            buttons: {
//                关闭: function() {
//                    $( this ).dialog( "close" );
//                }
//            }
//        });
//    });

    $("#txt").datepicker({
        //多个值之间用逗号隔开
        dateFormat:"yy-mm-dd",   //日期格式化处理
        changeMonth:true,      //让月份可以下拉选选择
        changeYear:true,      //让年份可以下拉选选择，默认文当前选择年份前后十年
        //完成月份名称替换为中文
        monthNames: [ "一月", "二月", "三月", "四月", "五月", "六月",
            "七月", "八月", "九月", "十月", "十一月", "十二月" ],
        //下拉选择的月份缩写替换为中文
        monthNamesShort: [ "一月", "二月", "三月", "四月", "五月", "六月",
            "七月", "八月", "九月", "十月", "十一月", "十二月" ],
        //星期几提示替换为中文
        dayNamesMin:[ "日", "一", "二", "三", "四", "五","六"],
        //星期几浮动提示提示替换为中文
        dayNames:[ "星期日", "星期一", "星期二", "星期三", "星期四", "星期五","星期六"],
        maxDate:"",//设置能够选择的最大日期，如果为当前日期写“0”，同时可以加1，也可以减1（单位：x/m/y）

        minDate:"" //设置能够选择的最小日期
    });
    //将jquery ui的日期选择的文字变小
    $("#ui-datepicker-div").css("font-size","10px");

$("#sp,#a").button();
$("#txt").tooltip();

</script>
</body>
</html>

（2）.遮罩层

$("input:button").click(function inpt(){
    $( "#dialog-modal" ).dialog({
        height: 140,
        modal: true,
        buttons: {
            关闭: function () {
                $(this).dialog("close");
            }
        }
    });
});

(3).JS复习

<div id="div1" style="position: relative;width: 600px;height: 480px;border: 1px solid gray;">
    <div style="position: absolute;left: 0;top: 0;width: 40px;height: 40px;background-color: orange;"></div>
</div>
<input type="button" value="走起"/><input type="button" value="暂停" disabled/>
<br/>
点击按钮后实现小div块在大的div块的内壁环行
<script>
//    document.body.childNodes
//    $ ====> jQuery
//    $("div:eq(0)");

    //用纯js来定位找到上的form
//    document.getElementById("myform");
//    document.getElementsByName("myform")[0];
//    document.getElementsByTagName("form")[0];
//    document.forms[0];document.forms["myform"];
//    document.myform;
//    document.body.childNodes，然后使用循环来确定是否为form元素节点

    //用jquery来定位找到上面的form
//    $("#myform");
//    $(".clform:eq(0)");
//    $("form").eq(0);
//    $("[action='myjquery1.html']:eq(0)");
//    $("body>form").eq(0);
//    $("div+form").eq(0);
//    $("div~form").eq(0);

// alert($("#myform>:input").length);
</script>
</body>
</html>