• input点击修改样式


    <input id="geren" type="button" value="个人奖励"   style="BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none;48%">
        <input id="bumen" type="button" value="部门奖励" style="BORDER-TOP-STYLE: none; BORDER-RIGHT-STYLE: none; BORDER-LEFT-STYLE: none; BORDER-BOTTOM-STYLE: none;48%">

    两个input 点击触发查事件并加入新的样式

    <style>
            /**
            加下划线
            */
    
    
            .xiahua
            {
                BORDER-BOTTOM-STYLE: solid !important;
            }
    
            /*.noxiahua*/
            /*{*/
                /*BORDER-BOTTOM-STYLE: none !important;*/
            /*}*/
    
    
        </style>

    加入代码添加样式

    <script>
        $("#bumen").click(function(){
            $("#bumen").addClass("xiahua");
            $("#geren").removeClass("xiahua");
            $.ajax({
                type:"post",
                url:"/selectOneselectOnejian.do",
                success:function(data){
                    if(data.success){
                        for(var i = 0 ; i<data.data.length;i++){
                            $("#ge").empty();
                            $('#ge').append("<h5><span style=' style='color: #282828''>用户:</span>"+data.data[i].jiali+"</h5>" +
                                "<div class='mui-input-row mui-password'>" +
                                "</div>" +
                                "<h5><span style=' style='color: #282828''>记录:</span>"+data.data[i].content+"</h5>" +
                                "<div class='mui-input-row mui-password'>" +
                                "</div>" +
                                "<h5><span style=' style='color: #282828''>积分:</span>"+data.data[i].jifen+"</h5>" +
                                "<div class='mui-input-row mui-password'>" +
                                "</div>" +
                                "<h5><span style=' style='color: #282828''>时间:</span>"+data.data[i].time+"</h5>" +
                                "<div class='mui-input-row mui-password'>" +
                                "</div>" +
                                "</div>"+
                                "<hr style='height:1px;border:none;border-top:1px solid #282828;'/>"
                            );
                        }
                    }else{
                        $("#ge").empty();
                        $('#ge').append("<h5><span style=' style='color: #282828''>无记录</span></h5>" );
                    }
                },
                error:function(){}
            })
    
        })
    
    
    </script>
    
    <script>
        $("#geren").click(function(){
            //$("#bumen").addClass("noxiahua");
            $("#bumen").removeClass("xiahua");
            $("#geren").addClass("xiahua");
            $("#ge").empty();
            $.ajax({
                type:"post",
                url:"/selectOnejiangli.do",
                success:function(data){
                    if(data.success){
                        $("#ge").empty();
                        for(var i = 0 ; i<data.data.length;i++){
                            $('#ge').append("<h5><span style=' style='color: #282828''>用户:</span>"+data.data[i].jiali+"</h5>" +
                                "<div class='mui-input-row mui-password'>" +
                                "</div>" +
                                "<h5><span style=' style='color: #282828''>记录:</span>"+data.data[i].content+"</h5>" +
                                "<div class='mui-input-row mui-password'>" +
                                "</div>" +
                                "<h5><span style=' style='color: #282828''>积分:</span>"+data.data[i].jifen+"</h5>" +
                                "<div class='mui-input-row mui-password'>" +
                                "</div>" +
                                "<h5><span style=' style='color: #282828''>时间:</span>"+data.data[i].time+"</h5>" +
                                "<div class='mui-input-row mui-password'>" +
                                "</div>" +
                                "</div>"+
                                "<hr style='height:1px;border:none;border-top:1px solid #282828;'/>"
                            );
                        }
                    }else{
                        $("#ge").empty();
                        $('#ge').append("<h5><span style=' style='color: #282828''>无记录</span></h5>" );
                    }
                },
                error:function(){}
            })
    
        })
    </script>

    一、语法
    选择器{样式:值!import;}
    二、说明
    提升指定样式规则的应用优先权,即!important为开发者提供了一个增加样式权重的方法,让浏览器首选执行这个语句。

    例如下面这个样式:

    .xiahua
    {
    BORDER-BOTTOM-STYLE: solid !important;
    }
     

    如果是在除了IE6的浏览器中,这些浏览器支持!important属性,也就是说他们会默认让margin-left:20px!important; 这条语句生效,下面的不带!important声明的样式将不会覆盖它,换句话说就是他的级别最高,下面的人都不能取代我!
    在IE6及以下浏览器有个比较显式的支持问题存在,!important在同一条规则集里不生效。请看下述代码:

    div {
         margin-left:20px!important;
    }
    div {
         margin-left:40px;
    }

    在上述代码中,IE6及以下浏览器中div的margin-left与其它浏览器一致,都为20px;
    注意:
    1、IE6及更早浏览器下,!important在同一条规则集内不生效。
    2、如果!important被用于一个简写的样式属性,那么这条简写的样式属性所代表的子属性都会被作用上!important。
    3、关键字!important必须放在一行样式的末尾并且要放在该行分号前,否则就没有效果。

  • 相关阅读:
    HDU 3008 DP
    XCode 7 高速切换代码窗体和文档窗体
    软工视频(37~46)-软件管理
    js 实现对ajax请求面向对象的封装
    sgu101Domino
    如何查看Eclipse的数字版的版本(转)
    Java的历史和大事记
    Eclipse使用前准备(转)
    启动 Eclipse 弹出“Failed to load the JNI shared library jvm.dll”错误的解决方法!
    如何快速配好java环境变量和查看电脑上安装JDK的版本位数
  • 原文地址:https://www.cnblogs.com/NCL--/p/9083428.html
Copyright © 2020-2023  润新知