zoukankan      html  css  js  c++  java
  • 关于采用css样式将多余的文字隐藏,以及实现树形菜单

    前不久根据项目需要,需要写个页面,在页面中需要动态的实现一个树形的菜单,经过问度娘,选择使用一个treeTable的js插件。http://zhanchaojiang.com/demo/demo/treeTable.html这是对该插件的介绍地址。在这个插件中有如下几个树形:theme:default或者是vsStyle,默认为default,差别应该在样式上,default是加减号,vsStyle是三角。expandLevel:默认展开的层数,默认值为1.也就是刷新该页面时树状图展开的层次。column:可控制的列的序号,默认是0.beforeExpand:展开子节点触发的事件,这个地方可以使用ajax进行异步请求。onSelect: function {拥有controller自定义属性的元素的点击事件,return false则中止展开.

    在使用该插件时需要引入jquery.js和treeTable.js,除此之外还需要引入相应的css样式文件,以及用到的图片。

    在使用这个插件的时候还碰到了一个问题,那就是给ajax请求到的数据进行渲染的时候,用jquery的click绑定事件,有“延迟”现象,也就是第一次点击没有触发绑定的事件,第二次点击才触发。解决办法是使用live进行事件的绑定,因为live是为现在和将来的某个元素绑定某个事件。

    除此之外还碰到了需要将树形菜单中多余的文字隐藏并用“...”代替的问题。使用css进行解决的办法是:

    <style>
    table td{white-space:nowrap;overflow:hidden; text-overflow:ellipsis;}
    table {table-layout:fixed;}
    </style>

    之后再对每一个td加上title属性,这样就可以在鼠标移动上去的时候显示出来多余的被隐藏的文字。

    这些只是工作中碰到的一点点小问题的解决办法,对于我这样刚入行的菜鸟来说,一点一点学习,才能逐渐变为大神。加油~

  • 相关阅读:
    Docker基本架构
    Dockerfile怎么创建镜像
    Dockerfile的指令
    Dockerfile基本结构
    Docker其它安全特性
    运行项目psychologicalTest
    第2章 安装Nodejs 2-4 Linux下安装Nodejs
    第2章 安装Nodejs 2-3 Windows下安装Nodejs
    第2章 安装Nodejs Nodejs基础 课程介绍
    2-2 第二天 利用 QQ 浏览器代理调试端口
  • 原文地址:https://www.cnblogs.com/blogofgyh/p/4052651.html
Copyright © 2011-2022 走看看