zoukankan      html  css  js  c++  java
  • 各种前端事件

    显示指定个数的字,多出的部分显示省略号

    方式一:简单粗暴

      显示前十个字符,后面的是省略号

    {{ user_info.username | truncate(10) }} 

    方式二:老老实实写 css && js

    css样式:

    .slb{
            text-overflow: ellipsis;
            white-space: nowrap;
            overflow: hidden;
             80px;
        }

    html页面:

    <tr>
        <td class="user_defined slb">
            <span style="text-align: center" onmouseout="miss(this)" onmousemove="appear(this)" ondblclick="add_check(this)">{{ info.username.0 }}</span>
            <span hidden>{{ info.uid }}</span>
            <span hidden>{{ info.profit }}</span>
       </td>
    </tr>
    

    下面是js

    function appear(ths) {
      $(ths).parent().removeClass('slb')
            }
    function miss(ths) {
      var has_class = $(ths).parent().hasClass('slb');
      if (has_class){
        $(ths).parent().removeClass()
      }else {
        $(ths).parent().addClass('slb')
       }
    }
    

    显示限制的事件:

    <!DOCTYPE html>
    <html>
    <head>
    	<title>xxx</title>
    	<meta charset="utf8">
    </head>
    <body>
    <input type="text" onkeyup='limit(this);'>
    <script>
    	function limit(ths){
    		if (ths.value.length > 10){
    			ths.value = ths.value.substring(0,10);
    		}
    	}
    </script>
    </body>
    </html>
    

    JS 中如何判断字符串类型的数字

    var str = "37";
    var n = Number(str);
    if (!isNaN(n))
    {
        alert("是数字");
    }
    

    js中的异步处理

    <button type="button" class="btn btn-primary btn-sm" onclick="save_all()"><i class="fa fa-dot-circle-o">确定</i></button>
    
    function save_all() {
            var date = $('#date').val();
            var hk_a = $('#hk_a').val();
            var status = $('#status').val();
            params = {};
            params["date"] = date;
            params["hk_a"] = hk_a;
            params["status"] = status;
            if(date!=''&&hk_a!=''&&status!=''){
                $.post('/save_holiday_info',params,function (data) {
                    async=false;
                    cache=false;
                    if(data.status == 0){
                        alert(data.message);
                        return false;
                    }else {
                        alert(data.message);
                        window.location.href = document.referrer;
                    }
    
                })
            }else {
                alert('请核对条件输入是否完整!!!!!');
                return false;
            }
        }
    

      

  • 相关阅读:
    第六篇 面向对象
    第四篇 函数
    基本http服务性能测试(Python vs Golang)
    七种常见经典排序算法总结(C++)
    461. Hamming Distance and 477. Total Hamming Distance in Python
    2. Add Two Numbers——Python
    21. Merge Two Sorted Lists —— Python
    求两个数字的最大公约数-Python实现,三种方法效率比较,包含质数打印质数的方法
    20. Valid Parentheses
    Python列表去除重复元素
  • 原文地址:https://www.cnblogs.com/mosson/p/6272755.html
Copyright © 2011-2022 走看看