如何用div+css制作一个两行五列的类似表格的东西

好吧,对于div+css我是完全的菜鸟,哪位大神帮忙写一下呀。谢谢

11个回答

<!DOCTYPE html>



Document
<br> .d_body{<br> height: auto;<br> width: 287px;<br> background-color: yellow;<br> }<br> .d_row,.d_row1{<br> border:1px solid black;<br> }<br> .d_row1{<br> border-top: 0px;<br> }<br> .span1{<br> border-right: 1px solid black;<br> width: 54px;<br> padding: 1px 15px 1px 15px;<br> }<br> .span2{<br> border-right: 1px solid black;<br> width: 54px;<br> padding: 1px 20px 1px 20px;<br> }<br> .span3{<br> border-right: 1px solid black;<br> width: 54px;<br> padding: 1px 16px 1px 16px;<br> }<br> .span4{<br> border-right: 1px solid black;<br> width: 54px;<br> padding: 1px 16px 1px 16px;<br> }<br> .span5{<br> width: 54px;<br> padding: 1px 14px 1px 14px;<br> }<br> .span6{<br> border-right: 1px solid black;<br> width: 54px;<br> padding: 1px 15px 1px 15px;<br> }<br> .span7{<br> border-right: 1px solid black;<br> width: 54px;<br> padding: 1px 4px 1px 4px;<br> }<br> .span8{<br> border-right: 1px solid black;<br> width: 54px;<br> padding: 1px 14px 1px 14px;<br> }<br> .span9{<br> border-right: 1px solid black;<br> width: 54px;<br> padding: 1px 9px 1px 9px;<br> }<br>


<div class="d_body"
<div class="d_row">
  <span class="span1">this</span>
  <span class="span2">is</span>
  <span class="span3">my</span>
  <span class="span4">div</span>
  <span class="span5">and</span>
</div>
<div class="d_row1">
  <span class="span6">css</span>
  <span class="span7">create</span>
  <span class="span8">like</span>
  <span class="span9">table</span>
  <span class="span0">function</span>
</div>



图片说明

niepxiya
niepxiya 能用吗
3 年多之前 回复
qq_22701921
指尖1993 谢谢。
3 年多之前 回复

是打发似的发生的防守打法

table
tr
td*5
tr
td*5
table

qq_22701921
指尖1993 纯div+css的。。。。。。
3 年多之前 回复
    我下面是两个表格,一个是一行,一个是是两行5列,style是css版式     
    希望能帮助到你。<th><td>一个加粗,一个不加粗。



            <style>
                .font-col-one {
                  background-color: floralwhite;
                  font-size:14px;
                  font-weight:750;
                  color:#gray 
                }
                .font-col-two {
                  background-color: floralwhite;
                  font-size:14px;
                  font-weight:750;
                  color:#gray 
                }
                .font-col-three {
                  color: #999;
                  line-height: 30px
                }
            </style>
            <table id="tab_detail" class="table table-bordered setting" width="100%">
                <colgroup align="center" valign="middle">
                    <col align="left">
                    <col align="left">
                    <col align="left">
                    <col align="left">
                    <col align="left">
                    <col align="left">
                    <col align="left">
                    <col width="10%" align="right">
                </colgroup>
                <tbody>
                    <tr>
                        <th rowspan="1" class="font-col-one" >任务名称</th>
                        <th rowspan="1" class="font-col-two" >${record.taskTerminal.taskName}</th>

                        <th rowspan="1" class="font-col-one" >定时周期</th>
                        <th rowspan="1" class="font-col-two" >${record.taskTerminal.scheduleJob.content}</th>

                        <th rowspan="1" class="font-col-one" >更新时间</th>
                        <th rowspan="1" class="font-col-two" >${record.updateTime}</th> 

                        <th rowspan="1" class="font-col-one" >终端成功执行率</th>
                        <th rowspan="1" class="font-col-two" >${record.coverage}</th>

                        <th rowspan="1" class="font-col-one" >事件数量</th>
                        <th rowspan="1" class="font-col-two" >${record.eventAmount}</th>
                    </tr>
                </tbody>
            </table>                <style>
                .font-col-one {
                  background-color: floralwhite;
                  font-size:14px;
                  font-weight:750;
                  color:#gray 
                }
                .font-col-two {
                  background-color: floralwhite;
                  font-size:14px;
                  font-weight:750;
                  color:#gray 
                }
                .font-col-three {
                  color: #999;
                  line-height: 30px
                }
            </style>
            <table id="tab_detail" class="table table-bordered setting" width="100%">
                <colgroup align="center" valign="middle">
                    <col align="left">
                    <col align="left">
                    <col align="left">
                    <col align="left">
                    <col align="left">
                    <col align="left">
                    <col align="left">
                    <col width="10%" align="right">
                </colgroup>
                <tbody>
                    <tr>
                        <th rowspan="1" class="font-col-one" >任务名称</th>
                        <th rowspan="1" class="font-col-two" >${record.taskTerminal.taskName}</th>

                        <th rowspan="1" class="font-col-one" >定时周期</th>
                        <th rowspan="1" class="font-col-two" >${record.taskTerminal.scheduleJob.content}</th>

                        <th rowspan="1" class="font-col-one" >更新时间</th>
                        <th rowspan="1" class="font-col-two" >${record.updateTime}</th> 

                        <th rowspan="1" class="font-col-one" >终端成功执行率</th>
                        <th rowspan="1" class="font-col-two" >${record.coverage}</th>

                        <th rowspan="1" class="font-col-one" >事件数量</th>
                        <th rowspan="1" class="font-col-two" >${record.eventAmount}</th>
                    </tr>
                </tbody>
            </table>
qq_22701921
指尖1993 大哥 有div+css的吗?不用table的那种?
3 年多之前 回复

这还要人家写,那还学个鸡毛

div下2个

5个设置宽高

div下2个p

5个span设置宽高

.cls{ width:19%; border:1px solid grey; float:left; }
1
2
3
4
5
1
2
3
4
5
<style>
.cls{
    width:19%;
    border:1px solid grey;
    float:left;
}

</style>
 <div style="width:800px;margin:0 auto;">
<div class="cls" >1</div>
<div class="cls" >2</div>
<div class="cls" >3</div>
<div class="cls" >4</div>
<div class="cls" >5</div>
<div class="cls" >1</div>
<div class="cls" >2</div>
<div class="cls" >3</div>
<div class="cls" >4</div>
<div class="cls" >5</div>

</div>
共11条数据 1 尾页
Csdn user default icon
上传中...
上传图片
插入图片
抄袭、复制答案,以达到刷声望分或其他目的的行为,在CSDN问答是严格禁止的,一经发现立刻封号。是时候展现真正的技术了!
其他相关推荐
如何用div+css制作一个两行五列的类似表格的东西
好吧,对于div+css我是完全的菜鸟,哪位大神帮忙写一下呀。谢谢
div效果,js jquery css
SpringMVC Spring hibernate 项目,现在我从后台查询,将结果赋给了一个list,在JSP里循环输出list里面的内容,显示在一张表里,现在有个功能就是更改,当点击表格某一行最后面的更改后,我想在该行的下面显示出一个div层,这个div层是显示在两行之间的,div里面包括要更改的这行的信息,现在这个显示div的效果这么做呢,点击保存或关闭后这个div自动消失,只有1C币了
请问在表格同一行如何让两行td对齐的布局问题
如图所示,求解,谢谢各位大触,没有积分。。。![图片说明](https://img-ask.csdn.net/upload/201602/29/1456755375_228938.jpg) 让商品名称与单价对齐 以下是代码: ```<td>1000110083</td> <td> <div class="tablespmc"><a onclick="showmask2()"><img src="echarts/doc/asset/img/about/loutongbing.jpg" class="tableimg"><div class="tablespmc-label">一条大道哟,通呀么通我家,我家住在哟,梁山下,家有五亩田,种点啥,啥子啥子哟,油菜花</div></div></a> <div class="tablespmc"><a onclick="showmask2()"><img src="echarts/doc/asset/img/about/loutongbing.jpg" class="tableimg"><div class="tablespmc-label">一条大道哟,通呀么通我家,我家住在哟,梁山下,家有五亩田,种点啥,啥子啥子哟,油菜花</div></div></a> </td> <td><div class="tablespmc" style="height: 100%;">65元</div> <div class="tablespmc" style="height: 100%;">65元</div> </td> ```
表格前两列固定 使用td相对定位 边框消失
表格需要前两列固定 给td做了相对定位“position":"relative","top":"0px","left":left,"background-color":"rgb(239, 239, 239)" 但是当左右滚动时 前两列的边框会不见,网上看了 网友提供的方法说是给td加 background-clip: border-box;貌似没有什么用,求各位大佬解救。 ``` function createGrid(data) { $("#gridContainer").empty(); $(".gridItem").css("windth",window.innerWidth); var tabWidth = data[0].data.length * 76 + 120; var time = []; var name = $("#measureType").find(".btnClick").eq(0).text(); var yAxisName = name + unitMap[name]; time.push("柜面名称","回路名称"); time = time.concat(data[0].xAxis); var $table = $("<table id='dataTable' style='border-collapse:collapse;width:"+tabWidth+"px'></table>"); var $tbody = $("<tbody></tbody>") var $timeTr = $("<tr style='background-color: rgb(239, 239, 239);'></tr>"); for(var i = 0;i < time.length;i ++){ var tdWidth = 120; if(i <= 1) { tdWidth = 120; } else { tdWidth = 76; } var $td = $("<td style='width:"+tdWidth+"px'>" + time[i] + "</td>") $timeTr.append($td); $tbody.append($timeTr); } for( var len=0; len<data.length;len++){ var value=[]; //var arr=data[len].title.split(","); value.push(data[len].title[0],data[len].title[1]); value = value.concat(data[len].data); var $valueTr = $("<tr></tr>"); for(var i = 0;i < time.length;i++){ var tdWidth = 120; if(i <= 1) { tdWidth = 120; } else { tdWidth = 76; } if(i==1){ var $td = $("<td style='width:"+tdWidth+"px; width:120px; color:blue;cursor:pointer' onclick='openDetailView("+'"'+data[len].kgId+'"'+","+'"'+data[len].pgId+'"'+","+'"'+data[len].stationId+'"'+")'>" + value[i] + "</td>") } else var $td = $("<td style='width:"+tdWidth+"px'>" + value[i] + "</td>") $valueTr.append($td); $tbody.append($valueTr); } } $table.append($tbody); $("#gridContainer").append($table); } $("#gridContainer").scroll(function(){//给table外面的div滚动事件绑定一个函数 var left=$("#gridContainer").scrollLeft();//获取滚动的距离 var trs=$("#gridContainer table tr");//获取表格的所有tr trs.each(function(i){//对每一个tr(每一行)进行处理 //获得每一行下面的所有的td,然后选中下标为0的,即第一列,设置position为相对定位 //相对于父div左边的距离为滑动的距离,然后设置个背景颜色,覆盖住后面几列数据滑动到第一列下面的情况 //如果有必要也可以设置一个z-index属性 if(i==0){ $(this).children().eq(0).css({"position":"relative","top":"0px","left":left,"background-color":"rgb(239, 239, 239)"}); $(this).children().eq(1).css({"position":"relative","top":"0px","left":left,"background-color":"rgb(239, 239, 239)"}); } else { $(this).children().eq(0).css({"position":"relative","top":"0px","left":left,"background-color":"white"}); $(this).children().eq(1).css({"position":"relative","top":"0px","left":left,"background-color":"white"}); } }); }); ```
easyui页面显示,就是在主页面显示另一个页面,那个页面没有完整的显示出来,但是在地址栏上输入那个页面的地址,那个页面就完整的显示,这怎么农
使用easyui做的main.jsp和busCarsManager.jsp 在main.jsp点击车辆管理即busCarsManager.jsp,显示成了这样 如下图 ![图片说明](https://img-ask.csdn.net/upload/202003/04/1583329850_48245.png) 在地址栏输入该页面url地址 ![图片说明](https://img-ask.csdn.net/upload/202003/04/1583329898_132483.png) 怎么弄好?? 以下是main.jsp代码 <title>Basic Form - jQuery EasyUI Demo</title> <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css"> <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css"> <link rel="stylesheet" type="text/css" href="easyui/themes/demo.css"> <script type="text/javascript" src="easyui/jquery.min.js"></script> <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script> <script type="text/javascript"> $(function() { $('#tt').tree({ //点击菜单事件 onClick: function(node){ //如果选项的url为空,null,直接退出,在页面不变 if(node.url==""||node.url==null){ return; } //如果选项卡存在 var flag=$('#tab').tabs('exists',node.text); //存在的条件下,选中,显示其内容 if(flag){ $('#tab').tabs('select',node.text); }else{ $('#tab').tabs('add',{ title: node.text, href:node.url, closable:true }); } } }); }); </script> <title>汽车租赁系统</title> </head> <body class="easyui-layout"> <div data-options="region:'north',split:true" style="height:100px;background: url('images/绿色.jpg')"> <div style="margin-left: 120px;margin-top: 30px;float:left;"> <span style="font-size: 32px;color:orange;font-weight:bold;">汽车租赁系统</span> </div> <div style="float: right ;margin-top: 60px;margin-right: 30px"> <span style="font-size: 18px;color: red;">欢迎admin用户登录</span> <a style="font-size: 18px;color: red;text-decoration: none">注销</a> </div> </div> <div data-options="region:'south',title:'版权信息',split:true" style="height:200px;background: url('images/版权信息.png'); background-repeat: no-repeat;background-color: silver;background-position: center;"></div> <div data-options="region:'east',title:'East',split:true" style="width:200px;"> <div id="date" class="easyui-calendar" style="width:180px;height:200px;"></div> </div> <div data-options="region:'west',title:'West',split:true" style="width:150px;"> <div id="menu" class="easyui-accordion" data-options="fit:true,border:false"> <div title="类别一"> <ul id="tt" class="easyui-tree" url="SysMenusController/findMoreMenus"></ul> </div> <div title="类别二"></div> <div title="类别三"></div> </div> </div> <div data-options="region:'center'" style="background:#eee;"> <div id="tab" class="easyui-tabs" data-options="fit:true"> <div title="默认页"> <img src="images/默认页.jpeg" width="90%" height="90%"> </div> </div> </div> </body> 以下是busCarsManager.jsp代码 <body data-options="fit:true"> <table id="busCarsManger_dg" title="My Cars" class="easyui-datagrid" style="width:600px;height:250px" url="/busCarsController/findAllBusCars" toolbar="#busCarsManger_toolbar" pagination="true" rownumbers="true" fitColumns="true" singleSelect="true"> <thead> <tr> <th field="carnumber" width="50">汽车牌号</th> <th field="lastname" width="50">汽车类型</th> <th field="pice" width="50">汽车价格</th> <th field="description" width="50">汽车描述</th> <th data-options="field:'carimg',formatter:showImage" width="50">汽车图片</th> </tr> </thead> </table> <div id="busCarsManger_toolbar"> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-add" plain="true" onclick="newCars()">新增汽车</a> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-edit" plain="true" onclick="editCars()">修改汽车信息</a> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-remove" plain="true" onclick="destroyCars()">移除</a> </div> <div id="busCarsManger_dlg" class="easyui-dialog" style="width:500px" data-options="closed:true,modal:true,border:'thin',buttons:'#busCarsManger_dlg-buttons'"> <form id="busCarsManger_fm" method="post" novalidate style="margin:0;padding:20px 50px"> <h3>汽车信息</h3> <div style="margin-bottom:10px"> <input name="carnumber" class="easyui-textbox" required="true" label="汽车牌号:" style="width:100%"> </div> <div style="margin-bottom:10px"> <input name="cartype" class="easyui-textbox" required="true" label="汽车类型:" style="width:100%"> </div> <div style="margin-bottom:10px"> <input name="color" class="easyui-textbox" required="true" label="汽车颜色" style="width:100%"> </div> <div style="margin-bottom:10px"> <input name="price" class="easyui-textbox" required="true" label="汽车价格" style="width:100%"> </div> <div style="margin-bottom:10px"> <input name="rentprice" class="easyui-textbox" required="true" label="汽车租金" style="width:100%"> </div> <div style="margin-bottom:10px"> <input name="deposit" class="easyui-textbox" required="true" label="汽车押金" style="width:100%"> </div> <div style="margin-bottom:10px"> <input name="description" class="easyui-textbox" required="true" label="汽车描述" style="width:100%"> </div> <input type="text" name="carimg" id="carimg"> </form> <form id="fm2" method="post" enctype="multipart/form-data" style="margin:0;padding:20px 50px"> <div style="margin-bottom:10px"> <input name="fil" class="easyui-filebox" label="汽车图片" style="width:70%"> <a href="javascript:void(0)" class="easyui-linkbutton c6" iconCls="icon-ok" onclick="fileUpload()" style="width:100px">上传图片</a> </div> <span id="sp1"></span> </form> </div> <div id="busCarsManger_dlg-buttons"> <a href="javascript:void(0)" class="easyui-linkbutton c6" iconCls="icon-ok" onclick="saveCars()" style="width:90px">Save</a> <a href="javascript:void(0)" class="easyui-linkbutton" iconCls="icon-cancel" onclick="javascript:$('#dlg').dialog('close')" style="width:90px">Cancel</a> </div> <script type="text/javascript"> //全局参数地址 var url; //删除车辆系信息操作 function destroyCars(){ //当表格信息被选中 var row= $('#busCarsManger_dg').datagrid('getSelected'); if(row){ //提示是否删除 $.messager.confirm("提示","是否删除该车辆信息",function(flag){ if(flag){ //发送Ajax请求,通过控制器执行删除车辆操作 $.post("busCarsController/removeBusCars",{'carnumber':row.carnumber},function(result){ if(result>0){ //删除成功重新加载表格数据 $("#busCarsManger_dg").datagrid("reload"); }else{ $.messager.alert("警告","删除失败","error"); } }) } }) }else //提示请选中至少一行 $.messager.alert("提示","请选中当前信息表的一行数据","info"); } //修改车辆信息 function editCars(){ //当数据表格被选中 var row= $('#busCarsManger_dg').datagrid('getSelected'); if(row){ //执行修改操作,打开修改对话框 $("#busCarsManger_dlg").dialog("open").dialog("center").dialog("setTitle","修改汽车信息") //加载当前选中信息行的数据,在表单一中回显 $("busCarsManger_fm").form("load",row); //表单二中图片的回显,不是用append方法,是因为每次点击修改就会加一个图片,故只用文本显示方法html $("#sp1").html("<img src='images/"+result.url+"'width='80px'/>") //点击保存时,实现修改操作,跳转到当前车辆信息表 url:"busCarsController/changeBusCars"; }else{ $.messager.alert("提示","请选中当前信息表的一行数据","info"); } } //文件上传的操作 function fileUpload(){ //提交form表单 $('#fm2').form('submit',{ url: "busCarsController/fileUpload", success: function(result){ var result=eval('('+result+')'); if(result.url){ //防止在执行修改车辆信息操作,上传图片时,需要清空表单二的图片,防止出现两个图片 $("#sp1").empty(); //显示图片 $("#sp1").append("<img src='images/"+result.url+"'width='80px'/>") //将图片名字赋值给隐藏域 $("#carimg").val("result.url"); }else{ $.messager.alert("提示","图片上传失败","error"); } } }); } //保存车辆信息 function saveCars(){ //获得表单的所有内容 var val =$("busCarsManger_fm").serialize(); $.post(url,val,function(result){ if(result>0){ //关闭当前的对话框 $("#busCarsManger_dlg").dialog("close") //刷新后面的表格 $("#busCarsManger_dg").datagrid("reload"); } }) } 添加车辆信息 function newCars(){ //添加新增对话框信息 $("#busCarsManger_dlg").dialog("open").dialog("center").dialog("setTitle","新增汽车") //清除表单之前的内容 $("busCarsManger_fm").form("clear") //清除图片表单项,要不然下次打开还在 $("#fm2").form("clear") //清除图片显示 $("#sp1").empty(); url="busCarsController/saveBusCars"; } function showImage(val){ return "<img src='images/"+val+"' width='80px'/>"; } </script> </body>
求JQ或JS仿京东淘宝属性规格SKU样式
把这个修改成属性值可以在input-text区自定义,删除自定义的值后自动恢复初始属性值。如图所示功能:![图片说明](https://img-ask.csdn.net/upload/201608/13/1471094693_376707.png) ``` <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>生成表格</title> <link rel="stylesheet" type="text/css" href="css/table.css"> <style type="text/css"> .hide {display: none;} .mt10 {margin-top: 10px;} .control-group {overflow: hidden;} .control-group a {color: #666;text-decoration: none;} .control-group a:hover {text-decoration: underline;} .control-label {float: left;width: 100px;line-height: 24px;} .controls {overflow: hidden;} .controls input[type="text"] {border: 1px solid #ddd;height: 20px;width: 120px;} .controls input[type="button"] {margin-top: 10px;height: 32px;cursor: pointer;} .config_item {margin-top: 10px;border: 1px dashed #ddd;padding: 10px;} .config_item section {margin-top: 10px;} .config_item section span {margin-right: 16px;} .config_item input[type="text"] {width: 80px;text-align: center;} .choose_config .Father_Title {margin: 0;margin-bottom: 10px;padding: 0;font-size: 16px;font-weight: normal;display: inline-block;vertical-align: middle;} .choose_config .Father_Item {padding: 0;margin: 0;margin-bottom: 10px;list-style: none;display: inline-block;vertical-align: middle;} .choose_config .Father_Item li {display: inline-block;margin-right: 10px;} .columnList {border-collapse: collapse;} .columnList th {background-color: #eee;} .columnList th,.columnList td {padding: 5px 10px;border: 1px solid #ddd;line-height: 24px;text-align: center;} </style> </head> <body> <!-- 选择信息 --> <div class="control-group choose_config"> <div class="control-label">选择信息:</div> <div class="controls"> <h3 class="Father_Title">颜色:</h3> <ul class="Father_Item Father_Item0"> <li><label><input id="Checkbox0" type="checkbox" class="checkbox check_all" value="全选">全选</label></li> <li><label><input id="Checkbox0" type="checkbox" class="checkbox check_item" value="红色">红色</label></li> <li><label><input id="Checkbox0" type="checkbox" class="checkbox check_item" value="白色">白色</label></li> <li><label><input id="Checkbox0" type="checkbox" class="checkbox check_item" value="土豪金">土豪金</label></li> </ul><br> <h3 class="Father_Title">内存:</h3> <ul class="Father_Item Father_Item1"> <li><label><input id="Checkbox0" type="checkbox" class="checkbox check_all" value="全选">全选</label></li> <li><label><input id="Checkbox1" type="checkbox" class="checkbox check_item" value="32G">32G</label></li> <li><label><input id="Checkbox1" type="checkbox" class="checkbox check_item" value="16G">16G</label></li> </ul><br> <h3 class="Father_Title">尺寸:</h3> <ul class="Father_Item Father_Item2"> <li><label><input id="Checkbox0" type="checkbox" class="checkbox check_all" value="全选">全选</label></li> <li><label><input id="Checkbox2" type="checkbox" class="checkbox check_item" value="5.5">5.5</label></li> <li><label><input id="Checkbox2" type="checkbox" class="checkbox check_item" value="4.5">4.5</label></li> <li><label><input id="Checkbox2" type="checkbox" class="checkbox check_item" value="3.5">3.5</label></li> </ul><br> </div> </div> <!-- 生成表格 --> <div class="control-group mt10"> <div class="control-label">生成表格:</div> <div class="controls" id="createTable"> </div> </div> <script type="text/javascript" src="http://code.jquery.com/jquery-latest.js"></script> <script type="text/javascript"> /** * Created by Administrator on 14-12-01. * 模拟淘宝SKU添加组合 * 页面注意事项: * 1、 .Father_Title 这个类作用是取到所有标题的值,赋给表格,如有改变JS也应相应改动 * 2、 .Father_Item 这个类作用是取类型组数,有多少类型就添加相应的类名:如: Father_Item1、Father_Item2、Father_Item3 ... */ $(function() { $(document).on('change', '.choose_config label', function() { var parent=$(this).parents('.Father_Item'); var _this=$('.checkbox',this); // 是否全选 $('.checkbox',parent).each(function() { var bCheck2=true; if (_this.hasClass('check_all')) { if (_this.get(0).checked) { bCheck2=true; $('.check_item',parent).prop('checked', bCheck2); }else{ bCheck2=false; $('.check_item',parent).prop('checked', bCheck2); } return false; } else { if ((!this.checked)&&(!$(this).hasClass('check_all'))) { bCheck2 = false; $('.check_all',parent).prop('checked', bCheck2); return false; } } $('.check_all',parent).prop('checked', bCheck2); }); step.Creat_Table(); }); var step = { // 信息组合 Creat_Table: function() { step.hebingFunction(); var SKUObj = $('.Father_Title'); var arrayTile = new Array(); // 表格标题数组 var arrayInfor = new Array(); // 盛放每组选中的CheckBox值的对象 var arrayColumn = new Array(); // 指定列,用来合并哪些列 var bCheck = true; // 是否全选,只有全选,表格才会生成 var columnIndex = 0; $.each(SKUObj, function(i, item) { arrayColumn.push(columnIndex++); arrayTile.push(SKUObj.eq(i).text().replace(':', '')); var itemName = '.Father_Item' + i; var bCheck2 = true; // 是否全选 // 获取选中的checkbox的值 var order = new Array(); $(itemName + ' .check_item:checked').each(function() { order.push($(this).val()); }); arrayInfor.push(order); if (order.join() == '') { bCheck = false; } }) // 开始生成表格 if (bCheck) { $('#createTable').html(''); var table = $('<table id="process" class="columnList"></table>'); table.appendTo($('#createTable')); var thead = $('<thead></thead>'); thead.appendTo(table); var trHead = $('<tr></tr>'); trHead.appendTo(thead); // 创建表头 var str = ''; $.each(arrayTile, function(index, item) { str += '<th width="100">' + item + '</th>'; }) str += '<th width="200">价格</th><th width="100">操作</th>'; trHead.append(str); var tbody = $('<tbody></tbody>'); tbody.appendTo(table); var zuheDate = step.doExchange(arrayInfor); if (zuheDate.length > 0) { //创建行 $.each(zuheDate, function(index, item) { var td_array = item.split(','); var tr = $('<tr></tr>'); tr.appendTo(tbody); var str = ''; $.each(td_array, function(i, values) { str += '<td>' + values + '</td>'; }); str += '<td ><input name="Txt_PriceSon" class="inpbox inpbox-mini" type="text"></td>'; str += '<td ><a href="#">删除</a></td>'; tr.append(str); }); } //结束创建Table表 arrayColumn.pop(); //删除数组中最后一项 //合并单元格 $(table).mergeCell({ // 目前只有cols这么一个配置项, 用数组表示列的索引,从0开始 cols: arrayColumn }); } else { //未全选中,清除表格 document.getElementById('createTable').innerHTML = ""; } }, hebingFunction: function() { $.fn.mergeCell = function(options) { return this.each(function() { var cols = options.cols; for (var i = cols.length - 1; cols[i] != undefined; i--) { mergeCell($(this), cols[i]); } dispose($(this)); }) }; function mergeCell($table, colIndex) { $table.data('col-content', ''); // 存放单元格内容 $table.data('col-rowspan', 1); // 存放计算的rowspan值 默认为1 $table.data('col-td', $()); // 存放发现的第一个与前一行比较结果不同td(jQuery封装过的), 默认一个"空"的jquery对象 $table.data('trNum', $('tbody tr', $table).length); // 要处理表格的总行数, 用于最后一行做特殊处理时进行判断之用 // 进行"扫面"处理 关键是定位col-td, 和其对应的rowspan $('tbody tr', $table).each(function(index) { // td:eq中的colIndex即列索引 var $td = $('td:eq(' + colIndex + ')', this); // 获取单元格的当前内容 var currentContent = $td.html(); // 第一次时走次分支 if ($table.data('col-content') == '') { $table.data('col-content', currentContent); $table.data('col-td', $td); } else { // 上一行与当前行内容相同 if ($table.data('col-content') == currentContent) { // 上一行与当前行内容相同则col-rowspan累加, 保存新值 var rowspan = $table.data('col-rowspan') + 1; $table.data('col-rowspan', rowspan); // 值得注意的是 如果用了$td.remove()就会对其他列的处理造成影响 $td.hide(); // 最后一行的情况比较特殊一点 // 比如最后2行 td中的内容是一样的, 那么到最后一行就应该把此时的col-td里保存的td设置rowspan // 最后一行不会向下判断是否有不同的内容 if (++index == $table.data('trNum')) $table.data('col-td').attr('rowspan', $table.data('col-rowspan')); } // 上一行与当前行内容不同 else { // col-rowspan默认为1, 如果统计出的col-rowspan没有变化, 不处理 if ($table.data('col-rowspan') != 1) { $table.data('col-td').attr('rowspan', $table.data('col-rowspan')); } // 保存第一次出现不同内容的td, 和其内容, 重置col-rowspan $table.data('col-td', $td); $table.data('col-content', $td.html()); $table.data('col-rowspan', 1); } } }) } // 同样是个private函数 清理内存之用 function dispose($table) { $table.removeData(); } }, doExchange: function(doubleArrays) { // 二维数组,最先两个数组组合成一个数组,与后边的数组组成新的数组,依次类推,知道二维数组变成以为数组,所有数据两两组合 var len = doubleArrays.length; if (len >= 2) { var arr1 = doubleArrays[0]; var arr2 = doubleArrays[1]; var len1 = arr1.length; var len2 = arr2.length; var newLen = len1 * len2; var temp = new Array(newLen); var index = 0; for (var i = 0; i < len1; i++) { for (var j = 0; j < len2; j++) { temp[index++] = arr1[i] + ',' + arr2[j]; } } var newArray = new Array(len - 1); newArray[0] = temp; if (len > 2) { var _count = 1; for (var i = 2; i < len; i++) { newArray[_count++] = doubleArrays[i]; } } return step.doExchange(newArray); } else { return doubleArrays[0]; } } } }) </script> </body> </html> ``` ``` ```
实用jquery实现动态拼装json数组中的内容拼装table
现有如下数组 Var json= [{"did":1,"businessType":"2-理赔","weekday":"2-周二","startTimeStr":"11:57:48","endTimeStr":"11:57:49","reserveNum":"11","branchCode":"8636","panelCode":"123"}, {"did":2,"businessType":"2-理赔","weekday":"2-周二","startTimeStr":"12:57:48","endTimeStr":"12:57:49","reserveNum":"22","branchCode":"8636","panelCode":"123"}, {"did":3,"businessType":"2-理赔","weekday":"3-周三","startTimeStr":"13:57:48","endTimeStr":"13:57:49","reserveNum":"33","branchCode":"8636","panelCode":"123"}, {"did":4,"businessType":"4-新契约","weekday":"4-周四","startTimeStr":"14:57:48","endTimeStr":"14:57:49","reserveNum":"44","branchCode":"8636","panelCode":"123"} ] =======================字段注释如下 businessType:业务类型 weekday:周期 startTimeStr- endTimeStr:时间段 可预约数:reserveNum -----业务类型对应关系 1 保全 2 理赔 3 投诉 4 新契约 5 产品销售 6 保全受理 7 保全处理 9 法人保全 10 续期业务 11 财务 12 其他 13 咨询 --周期对应关系 1 周一 2 周二 3 周三 4 周四 5 周五 6 周六 7 周日 *********************************实现效果,根据json数组实现如下table效果,实用jquery动态拼装,解析json实现效果,**已经实现,但有两个问题, 1、如果业务类型 相同个数超过3个,则表格会乱掉(如同时添加3个 业务类型为:理赔) 2、如果业务类型对应码大于 10 ,则表格会乱掉(如选择 10 续期业务或11财务等) ** 实现代码如下, function myCallBackDetailAdd(json1){ var even = 0; var odd = 1; $.each(json1,function(){ var businessType = this.businessType.split('-'); var weekDay = this.weekday.split('-'); //业务范围中文 var btext = businessType[1]; //业务范围value var bid = parseInt(businessType[0]); //周期中文 var text = weekDay[1]; //周期value var id = parseInt(weekDay[0]); //时间段 var time = this.startTimeStr+"-"+this.endTimeStr; //可预约数 var num = this.reserveNum; //删除使用的id var didarg =parseInt(this.did); //第一行 var interHtmlweek1 = "<th id=th"+id+" colspan='3'>"+text+"</th>"; //第二行 var interHtmlweek2 = "<th id=th"+id+">时间段</th>"+"<th id=th"+id+">可预约数</th>"+"<th id=th"+id+">操作</th>"; var interHtmlweek3 = "<td id=td"+id+">"+time+"</td>"+"<td id=td"+id+">"+num+"</td>"+"<td id=td"+id+">"+ "<a title='修改' href='css/reserveInfo/reserveInfoAddModify_reserveInfoAction.action' maxable='true' minable='true' resizable='true' width='450' height='200' target='dialog' onclick='modifyReserveDetail(this,"+id+","+didarg+");' class='btnEdit' >修改</a>"+ "<a id='delButton' title='删除' onclick='delReserveDetail(this,"+id+","+didarg+");' class='btnDel' >删除</a>"+ "</td>"; //排序td,th $('#theadAdd tr#tr0 th:gt(0)').each(function(){ var thIndex = $(this).attr('id').substr(2,3); if(parseInt(thIndex)>parseInt(id)&&($("#theadAdd tr#tr0 th#th"+id).length==0)){ $(interHtmlweek1).insertBefore("#theadAdd tr#tr0 th#th"+thIndex+":eq(0)"); $(interHtmlweek2).insertBefore("#theadAdd tr#tr1 th#th"+thIndex+":eq(0)"); $(interHtmlweek3).insertBefore("#tbodyAdd tr#bodyTr"+bid+even+" td#td"+thIndex+":eq(0)"); }else if(parseInt(thIndex)==parseInt(id) && $("#theadAdd tr#tr0 th#th"+id).length>0 && $("#tbodyAdd tr#bodyTr"+bid+even+" td#td"+id).length >0){ /* $("#tbodyAdd tr#bodyTr"+bid+even).attr("rowspan","2");*/ if($("#tbodyAdd tr#bodyTr"+bid+odd).length ==0){ $("#tbodyAdd tr#bodyTr"+bid+even+" td:eq(0)").attr("rowspan","2"); $("<tr height='25' id=bodyTr"+bid+odd+" align='center' bgcolor='white'>"+"</tr>").insertAfter("#tbodyAdd tr#bodyTr"+bid+even); $("#tbodyAdd tr#bodyTr"+bid+odd).append(interHtmlweek3).initUI(); }else{ $("#tbodyAdd tr#bodyTr"+bid+odd).append(interHtmlweek3).initUI(); } }else if( parseInt(thIndex)>parseInt(id)&&($("#tbodyAdd tr#bodyTr"+bid+even+" td#td"+id).length ==0)){ $(interHtmlweek3).insertBefore("#tbodyAdd tr#bodyTr"+bid+even+" td#td"+thIndex+":eq(0)"); } }); if($("#tbodyAdd tr#bodyTr"+bid+even).length==0){ //添加一行 $("#tbodyAdd").append("<tr height='25' id=bodyTr"+bid+even+" align='center' bgcolor='white'>"+"</tr>"); $("#tbodyAdd tr#bodyTr"+bid+even).append("<td id=td"+bid+id+">"+"<div>"+btext+"</div>"+"</td>"); } //添加第一第二行的列 if($("#theadAdd tr#tr0 th#th"+id).length==0){ $('#theadAdd tr#tr0').append(interHtmlweek1); $('#theadAdd tr#tr1').append(interHtmlweek2); } if($("#tbodyAdd tr#bodyTr"+bid+even+" td#td"+id).length==0){ $("#tbodyAdd tr#bodyTr"+bid+even).append(interHtmlweek3).initUI(); }; }); $("#tbodyAdd tr").each(function(i){ //获取每行的id var tr = $("#tbodyAdd tr"+":eq("+i+")").attr('id').substr(6,8); $('#theadAdd tr#tr0 th:gt(0)').each(function(k){ //获取周期的id var Index = $(this).attr('id').substr(2,3); //获取每行添值相同id的第一列id if($("#tbodyAdd tr"+":eq("+i+")"+" td:eq(0)").attr("id").length ==4){ if($("#tbodyAdd tr"+":eq("+i+")"+" td"+":eq("+(3*k+1)+")").length==0){ var dd = $("#tbodyAdd tr"+":eq("+i+")"+" td"+":eq("+(3*k-2)+")").attr('id').substr(2,3); $("<td id=td"+Index+">"+"</td>"+"<td id=td"+Index+">"+"</td>"+"<td id=td"+Index+">"+"</td>").insertAfter("#tbodyAdd tr#bodyTr"+tr+" td#td"+dd+":eq(2)"); }else{ $("#tbodyAdd tr"+":eq("+i+")"+" td"+":eq("+(3*k+1)+")").each(function(){ var td = $("#tbodyAdd tr"+":eq("+i+")"+" td"+":eq("+(3*k+1)+")").attr('id').substr(2,3); if(parseInt(Index) < parseInt(td)){ $("<td id=td"+Index+">"+"</td>"+"<td id=td"+Index+">"+"</td>"+"<td id=td"+Index+">"+"</td>").insertBefore("#tbodyAdd tr#bodyTr"+tr+" td#td"+td+":eq(0)"); } }); } }else{ if($("#tbodyAdd tr"+":eq("+i+")"+" td"+":eq("+(3*k)+")").length==0){ var dd = $("#tbodyAdd tr"+":eq("+i+")"+" td"+":eq("+(3*k-1)+")").attr('id').substr(2,3); $("<td id=td"+Index+">"+"</td>"+"<td id=td"+Index+">"+"</td>"+"<td id=td"+Index+">"+"</td>").insertAfter("#tbodyAdd tr#bodyTr"+tr+" td#td"+dd+":eq(2)"); }else{ $("#tbodyAdd tr"+":eq("+i+")"+" td"+":eq("+(3*k)+")").each(function(){ var td = $("#tbodyAdd tr"+":eq("+i+")"+" td"+":eq("+(3*k)+")").attr('id').substr(2,3); if(parseInt(Index) < parseInt(td)){ $("<td id=td"+Index+">"+"</td>"+"<td id=td"+Index+">"+"</td>"+"<td id=td"+Index+">"+"</td>").insertBefore("#tbodyAdd tr#bodyTr"+tr+" td#td"+td+":eq(0)"); } }); } } }); }); //清空json数组 json.splice(0,json.length); } 实现效果图如下: ![图片说明](https://img-ask.csdn.net/upload/201509/04/1441354935_70702.png)
firefox中grid上下按键
gridpanel面板中有一个id为title的textfield编辑框,有一个gird表格. <br />在ie里 textfield编辑框按下 down 键光标焦点转到 grid 的第一行, <br />为什么在 firefox里&nbsp; 光标焦点就转不到grid的第一行呢. <br />title的按键设置是: <br />&nbsp;&nbsp;&nbsp; var TextFielddown=Ext.get("title"); <br />&nbsp;&nbsp;&nbsp; new Ext.KeyMap(TextFielddown, { <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; key:40, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fn: function(e){ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; grid.getSelectionModel().selectFirstRow(); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var row = grid.getView().getRow(0); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Ext.get(row).focus(); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; scope : TextFielddown <br />&nbsp;&nbsp;&nbsp; }); <br />在firefox下应该怎样做.<br/><strong>问题补充</strong><br/>在使用谷歌的浏览器的时候,用上面的代码,光标的焦点也不能到grid表格的第一行, <br />用什么方法可以,请指点指点.谢谢.<br /><strong>问题补充:</strong><br />&lt;HTML&gt; <br />&lt;HEAD&gt; <br />&nbsp; &lt;TITLE&gt;Ext.grid.GridPanel示例&lt;/TITLE&gt; <br />&nbsp; &lt;meta http-equiv="Content-Type" content="text/html; charset=utf-8"&gt; <br />&nbsp; &lt;link rel="stylesheet" type="text/css" href="/extjs/resources/css/ext-all.css" /&gt; <br />&nbsp; &lt;script type="text/javascript" src="/extjs/adapter/ext/ext-base.js"&gt;&lt;/script&gt; <br />&nbsp; &lt;script type="text/javascript" src="/extjs/ext-all.js"&gt;&lt;/script&gt; <br />&nbsp; &lt;script type="text/javascript" src="/extjs/source/locale/ext-lang-zh_CN.js"&gt;&lt;/script&gt; <br />&nbsp; &lt;script type="text/javascript"&gt; <br />&nbsp; Ext.onReady(function(){ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //定义数据二维数组 <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var data=[ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ['列1内容1', '列2内容1','列3内容1','列4内容1', '列5内容1','列6内容1'], <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ['列1内容2', '列2内容2','列3内容2','列4内容2', '列5内容2','列6内容2'], <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ['列1内容3', '列2内容3','列3内容3','列4内容3', '列5内容3','列6内容3'], <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ['列1内容4', '列2内容4','列3内容4','列4内容4', '列5内容4','列6内容4'], <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ['列1内容5', '列2内容5','列3内容5','列4内容5', '列5内容5','列6内容5'], <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ['列1内容6', '列2内容6','列3内容6','列4内容6', '列5内容6','列6内容6'], <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ['列1内容7', '列2内容7','列3内容7','列4内容7', '列5内容7','列6内容7'], <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ['列1内容8', '列2内容8','列3内容8','列4内容8', '列5内容8','列6内容8'] <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ]; <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //整理数据定义3列的索引为con1,con2,con3 <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var store=new Ext.data.SimpleStore({ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; data:data,fields:['con1','con2','con3','con4','con5','con6'] <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //定义勾选框,不需要可不必定义 <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var sm = new Ext.grid.CheckboxSelectionModel({singleSelect:true}); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //定义列 <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var colm=new Ext.grid.ColumnModel([ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; new Ext.grid.RowNumberer(),//增加自动编号,不需要可不必定义 <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; sm,//勾选框,不需要可不必定义 <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {header:'第一',dataIndex:'con1'}, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {header:'第二',dataIndex:'con2'}, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {header:'第三',dataIndex:'con3'}, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {header:'第四',dataIndex:'con4'}, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {header:'第五',dataIndex:'con5'}, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; {header:'第六',dataIndex:'con6'} <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ]); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; //生成表格 <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var grid = new Ext.grid.GridPanel({ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; id:'gridtx', <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; layout:'fit', <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; autoScroll:true, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; renderTo:'grid-div', <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; title:"显示同学信息列表", <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height:350, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width:900, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; cm:colm, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; sm:sm, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; store:store, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; tbar: new Ext.Toolbar({ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height:40, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; autoScroll:true, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; style:"padding:10px", <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; items:['-', <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; '查询条件', <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; '-', <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; new Ext.form.TextField({&nbsp;&nbsp;&nbsp;&nbsp; //加入表单元素 <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; id:'xmname', <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; width:100 <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }),'-',{ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; text:"确认条件查询", <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; handler: function(){ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; } <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; ] <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }) , <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; bbar: new Ext.PagingToolbar({ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; store: store, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; pageSize:20, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; displayInfo: false, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; style:"padding:10px", <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; height:40 <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }) <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var gridel=Ext.get("gridtx"); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; new Ext.KeyMap(gridel, [{ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; key:119, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fn: function(e){ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var gridtoxmtj=Ext.get('xmname'); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; gridtoxmtj.focus(); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; scope : gridel <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }]); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var xmnameel=Ext.get("xmname"); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; new Ext.KeyMap(xmnameel, [{ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; key:40, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; fn: function(e){ <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; grid.getSelectionModel().selectFirstRow(); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; var row = grid.getView().getRow(0); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Ext.get(row).focus(); <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }, <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; scope : xmnameel <br />&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; }]); <br />&nbsp; }); <br />&nbsp; &lt;/script&gt; <br />&lt;/HEAD&gt; <br />&lt;BODY style="margin=10 10 10 10;"&gt; <br /> &nbsp; &lt;div id='grid-div'&gt;&lt;/div&gt; <br />&lt;/BODY&gt; <br />&lt;/HTML&gt;<br /><strong>问题补充:</strong><br />我就是想要在另外的两个浏览器中也能够定位在第一行,还能够上下移动.这样的结果.<br /><strong>问题补充:</strong><br />谢谢,非常感谢.
推荐 130 个令你眼前一亮的网站,总有一个用得着
总结了大学生活两年来,发现的 130 余个黑科技网站,总有一个会让你眼前一亮,赶紧收藏!
在中国程序员是青春饭吗?
今年,我也32了 ,为了不给大家误导,咨询了猎头、圈内好友,以及年过35岁的几位老程序员……舍了老脸去揭人家伤疤……希望能给大家以帮助,记得帮我点赞哦。 目录: 你以为的人生 一次又一次的伤害 猎头界的真相 如何应对互联网行业的「中年危机」 一、你以为的人生 刚入行时,拿着傲人的工资,想着好好干,以为我们的人生是这样的: 等真到了那一天,你会发现,你的人生很可能是这样的: ...
我在支付宝花了1分钟,查到了女朋友的开房记录!
在大数据时代下,不管你做什么都会留下蛛丝马迹,只要学会把各种软件运用到极致,捉奸简直轻而易举。今天就来给大家分享一下,什么叫大数据抓出轨。据史料证明,马爸爸年轻时曾被...
程序员请照顾好自己,周末病魔差点一套带走我。
程序员在一个周末的时间,得了重病,差点当场去世,还好及时挽救回来了。
卸载 x 雷某度!GitHub 标星 1.5w+,从此我只用这款全能高速下载工具!
作者 | Rocky0429 来源 | Python空间 大家好,我是 Rocky0429,一个喜欢在网上收集各种资源的蒟蒻… 网上资源眼花缭乱,下载的方式也同样千奇百怪,比如 BT 下载,磁力链接,网盘资源等等等等,下个资源可真不容易,不一样的方式要用不同的下载软件,因此某比较有名的 x 雷和某度网盘成了我经常使用的工具。 作为一个没有钱的穷鬼,某度网盘几十 kb 的下载速度让我...
20道你必须要背会的微服务面试题,面试一定会被问到
写在前面: 在学习springcloud之前大家一定要先了解下,常见的面试题有那块,然后我们带着问题去学习这个微服务技术,那么就会更加理解springcloud技术。如果你已经学了springcloud,那么在准备面试的时候,一定要看看看这些面试题。 文章目录1、什么是微服务?2、微服务之间是如何通讯的?3、springcloud 与dubbo有哪些区别?4、请谈谈对SpringBoot 和S...
讲真,这两个IDE插件,可以让你写出质量杠杠的代码
周末躺在床上看《拯救大兵瑞恩》 周末在闲逛的时候,发现了两个优秀的 IDE 插件,据说可以提高代码的质量,我就安装了一下,试了试以后发现,确实很不错,就推荐给大家。 01、Alibaba Java 代码规范插件 《阿里巴巴 Java 开发手册》,相信大家都不会感到陌生,其 IDEA 插件的下载次数据说达到了 80 万次,我今天又贡献了一次。嘿嘿。 该项目的插件地址: https://github....
为什么猝死的都是程序员,基本上不见产品经理猝死呢?
相信大家时不时听到程序员猝死的消息,但是基本上听不到产品经理猝死的消息,这是为什么呢? 我们先百度搜一下:程序员猝死,出现将近700多万条搜索结果: 搜索一下:产品经理猝死,只有400万条的搜索结果,从搜索结果数量上来看,程序员猝死的搜索结果就比产品经理猝死的搜索结果高了一倍,而且从下图可以看到,首页里面的五条搜索结果,其实只有两条才是符合条件。 所以程序员猝死的概率真的比产品经理大,并不是错...
毕业5年,我问遍了身边的大佬,总结了他们的学习方法
我问了身边10个大佬,总结了他们的学习方法,原来成功都是有迹可循的。
推荐10个堪称神器的学习网站
每天都会收到很多读者的私信,问我:“二哥,有什么推荐的学习网站吗?最近很浮躁,手头的一些网站都看烦了,想看看二哥这里有什么新鲜货。” 今天一早做了个恶梦,梦到被老板辞退了。虽然说在我们公司,只有我辞退老板的份,没有老板辞退我这一说,但是还是被吓得 4 点多都起来了。(主要是因为我掌握着公司所有的核心源码,哈哈哈) 既然 4 点多起来,就得好好利用起来。于是我就挑选了 10 个堪称神器的学习网站,推...
这些软件太强了,Windows必装!尤其程序员!
Windows可谓是大多数人的生产力工具,集娱乐办公于一体,虽然在程序员这个群体中都说苹果是信仰,但是大部分不都是从Windows过来的,而且现在依然有很多的程序员用Windows。 所以,今天我就把我私藏的Windows必装的软件分享给大家,如果有一个你没有用过甚至没有听过,那你就赚了????,这可都是提升你幸福感的高效率生产力工具哦! 走起!???? NO、1 ScreenToGif 屏幕,摄像头和白板...
阿里面试,面试官没想到一个ArrayList,我都能跟他扯半小时
我是真的没想到,面试官会这样问我ArrayList。
曾经优秀的人,怎么就突然不优秀了。
职场上有很多辛酸事,很多合伙人出局的故事,很多技术骨干被裁员的故事。说来模板都类似,曾经是名校毕业,曾经是优秀员工,曾经被领导表扬,曾经业绩突出,然而突然有一天,因为种种原因,被裁员了,...
大学四年因为知道了这32个网站,我成了别人眼中的大神!
依稀记得,毕业那天,我们导员发给我毕业证的时候对我说“你可是咱们系的风云人物啊”,哎呀,别提当时多开心啦????,嗯,我们导员是所有导员中最帅的一个,真的???? 不过,导员说的是实话,很多人都叫我大神的,为啥,因为我知道这32个网站啊,你说强不强????,这次是绝对的干货,看好啦,走起来! PS:每个网站都是学计算机混互联网必须知道的,真的牛杯,我就不过多介绍了,大家自行探索,觉得没用的,尽管留言吐槽吧???? 社...
良心推荐,我珍藏的一些Chrome插件
上次搬家的时候,发了一个朋友圈,附带的照片中不小心暴露了自己的 Chrome 浏览器插件之多,于是就有小伙伴评论说分享一下我觉得还不错的浏览器插件。 我下面就把我日常工作和学习中经常用到的一些 Chrome 浏览器插件分享给大家,随便一个都能提高你的“生活品质”和工作效率。 Markdown Here Markdown Here 可以让你更愉快的写邮件,由于支持 Markdown 直接转电子邮...
看完这篇HTTP,跟面试官扯皮就没问题了
我是一名程序员,我的主要编程语言是 Java,我更是一名 Web 开发人员,所以我必须要了解 HTTP,所以本篇文章就来带你从 HTTP 入门到进阶,看完让你有一种恍然大悟、醍醐灌顶的感觉。 最初在有网络之前,我们的电脑都是单机的,单机系统是孤立的,我还记得 05 年前那会儿家里有个电脑,想打电脑游戏还得两个人在一个电脑上玩儿,及其不方便。我就想为什么家里人不让上网,我的同学 xxx 家里有网,每...
2020 年,大火的 Python 和 JavaScript 是否会被取而代之?
Python 和 JavaScript 是目前最火的两大编程语言,但是2020 年,什么编程语言将会取而代之呢? 作者 |Richard Kenneth Eng 译者 |明明如月,责编 | 郭芮 出品 | CSDN(ID:CSDNnews) 以下为译文: Python 和 JavaScript 是目前最火的两大编程语言。然而,他们不可能永远屹立不倒。最终,必将像其他编程语言一...
史上最全的IDEA快捷键总结
现在Idea成了主流开发工具,这篇博客对其使用的快捷键做了总结,希望对大家的开发工作有所帮助。
阿里程序员写了一个新手都写不出的低级bug,被骂惨了。
这种新手都不会范的错,居然被一个工作好几年的小伙子写出来,差点被当场开除了。
谁是华为扫地僧?
是的,华为也有扫地僧!2020年2月11-12日,“养在深闺人不知”的华为2012实验室扫地僧们,将在华为开发者大会2020(Cloud)上,和大家见面。到时,你可以和扫地僧们,吃一个洋...
Flutter 会不会被苹果限制其发展?
这个可能性是存在的,而且不止是 flutter、react-native 、weex 、uni-app 、taro 、Hippy等都存在这个风险,虽然有些框架对比起 flutter 其他框架存在时间稍长,但是这不可否认它们一直都存在这个风向。 只要不是平台自己的亲儿子,那么肯定存在被限制发展的风险,所以这件事上是风险和收益之间的博弈,这是一个“后妈和前任之间的太极。” 先说现状 如今各大平台,如:...
没用过这些 IDEA 插件?怪不得写代码头疼
使用插件,可以提高开发效率。对于开发人员很有帮助。这篇博客介绍了IDEA中最常用的一些插件。
AI 没让人类失业,搞 AI 的人先失业了
最近和几个 AI 领域的大佬闲聊 根据他们讲的消息和段子 改编出下面这个故事 如有雷同 都是巧合 1. 老王创业失败,被限制高消费 “这里写我跑路的消息实在太夸张了。” 王葱葱哼笑一下,把消息分享给群里。 阿杰也看了消息,笑了笑。在座几位也都笑了。 王葱葱是个有名的人物,21岁那年以全额奖学金进入 KMU 攻读人工智能博士,累计发表论文 40 余篇,个人技术博客更是成为深度学习领域内风向标。 ...
2020年,冯唐49岁:我给20、30岁IT职场年轻人的建议
点击“技术领导力”关注∆每天早上8:30推送 作者|Mr.K 编辑| Emma 来源|技术领导力(ID:jishulingdaoli) 前天的推文《冯唐:职场人35岁以后,方法论比经验重要》,收到了不少读者的反馈,觉得挺受启发。其实,冯唐写了不少关于职场方面的文章,都挺不错的。可惜大家只记住了“春风十里不如你”、“如何避免成为油腻腻的中年人”等不那么正经的文章。 本文整理了冯...
最全最强!世界大学计算机专业排名总结!
我正在参与CSDN200进20,希望得到您的支持,扫码续投票5次。感谢您! (为表示感谢,您投票后私信我,我把我总结的人工智能手推笔记和思维导图发送给您,感谢!) 目录 泰晤士高等教育世界大学排名 QS 世界大学排名 US News 世界大学排名 世界大学学术排名(Academic Ranking of World Universities) 泰晤士高等教育世界大学排名 中国共...
作为一名大学生,如何在B站上快乐的学习?
B站是个宝,谁用谁知道???? 作为一名大学生,你必须掌握的一项能力就是自学能力,很多看起来很牛X的人,你可以了解下,人家私底下一定是花大量的时间自学的,你可能会说,我也想学习啊,可是嘞,该学习啥嘞,不怕告诉你,互联网时代,最不缺的就是学习资源,最宝贵的是啥? 你可能会说是时间,不,不是时间,而是你的注意力,懂了吧! 那么,你说学习资源多,我咋不知道,那今天我就告诉你一个你必须知道的学习的地方,人称...
那些年,我们信了课本里的那些鬼话
教材永远都是有错误的,从小学到大学,我们不断的学习了很多错误知识。 斑羚飞渡 在我们学习的很多小学课文里,有很多是错误文章,或者说是假课文。像《斑羚飞渡》: 随着镰刀头羊的那声吼叫,整个斑羚群迅速分成两拨,老年斑羚为一拨,年轻斑羚为一拨。 就在这时,我看见,从那拨老斑羚里走出一只公斑羚来。公斑羚朝那拨年轻斑羚示意性地咩了一声,一只半大的斑羚应声走了出来。一老一少走到伤心崖,后退了几步,突...
一个程序在计算机中是如何运行的?超级干货!!!
强烈声明:本文很干,请自备茶水!???? 开门见山,咱不说废话! 你有没有想过,你写的程序,是如何在计算机中运行的吗?比如我们搞Java的,肯定写过这段代码 public class HelloWorld { public static void main(String[] args) { System.out.println("Hello World!"); } ...
【蘑菇街技术部年会】程序员与女神共舞,鼻血再次没止住。(文末内推)
蘑菇街技术部的年会,别开生面,一样全是美女。
Linux必懂知识大总结(补)
关机 1. 数据同步写入磁盘 sync 为了加快对磁盘上文件的读写速度,位于内存中的文件数据不会立即同步到磁盘上,因此关机之前需要先进行 sync 同步操作。 2. shutdown # /sbin/shutdown [-krhc] [时间] [警告讯息] -k : 不会关机,只是发送警告讯息,通知所有在线的用户 -r : 将系统的服务停掉后就重新启动 -h : 将系统的服务停掉后就...
那个在阿里养猪的工程师,5年了……
简介: 在阿里,走过1825天,没有趴下,依旧斗志满满,被称为“五年陈”。他们会被授予一枚戒指,过程就叫做“授戒仪式”。今天,咱们听听阿里的那些“五年陈”们的故事。 下一个五年,猪圈见! 我就是那个在养猪场里敲代码的工程师,一年多前我和20位工程师去了四川的猪场,出发前总架构师慷慨激昂的说:同学们,中国的养猪产业将因为我们而改变。但到了猪场,发现根本不是那么回事:要个WIFI,没有;...
为什么程序猿都不愿意去外包?
分享外包的组织架构,盈利模式,亲身经历,以及根据一些外包朋友的反馈,写了这篇文章 ,希望对正在找工作的老铁有所帮助
Java校招入职华为,半年后我跑路了
何来 我,一个双非本科弟弟,有幸在 19 届的秋招中得到前东家华为(以下简称 hw)的赏识,当时秋招签订就业协议,说是入了某 java bg,之后一系列组织架构调整原因等等让人无法理解的神操作,最终毕业前夕,被通知调往其他 bg 做嵌入式开发(纯 C 语言)。 由于已至于校招末尾,之前拿到的其他 offer 又无法再收回,一时感到无力回天,只得默默接受。 毕业后,直接入职开始了嵌入式苦旅,由于从未...
世界上有哪些代码量很少,但很牛逼很经典的算法或项目案例?
点击上方蓝字设为星标下面开始今天的学习~今天分享四个代码量很少,但很牛逼很经典的算法或项目案例。1、no code 项目地址:https://github.com/kelseyhight...
Python全栈 Linux基础之3.Linux常用命令
Linux对文件(包括目录)有很多常用命令,可以加快开发效率:ls是列出当前目录下的文件列表,选项有-a、-l、-h,还可以使用通配符;c功能是跳转目录,可以使用相对路径和绝对路径;mkdir命令创建一个新的目录,有-p选项,rm删除文件或目录,有-f、-r选项;cp用于复制文件,有-i、-r选项,tree命令可以将目录结构显示出来(树状显示),有-d选项,mv用来移动文件/目录,有-i选项;cat查看文件内容,more分屏显示文件内容,grep搜索内容;>、>>将执行结果重定向到一个文件;|用于管道输出。
​两年前不知如何编写代码的我,现在是一名人工智能工程师
全文共3526字,预计学习时长11分钟 图源:Unsplash 经常有小伙伴私信给小芯,我没有编程基础,不会写代码,如何进入AI行业呢?还能赶上AI浪潮吗? 任何时候努力都不算晚。 下面,小芯就给大家讲一个朋友的真实故事,希望能给那些处于迷茫与徘徊中的小伙伴们一丝启发。(下文以第一人称叙述) 图源:Unsplash 正如Elsa所说,职业转换是...
强烈推荐10本程序员必读的书
很遗憾,这个春节注定是刻骨铭心的,新型冠状病毒让每个人的神经都是紧绷的。那些处在武汉的白衣天使们,尤其值得我们的尊敬。而我们这些窝在家里的程序员,能不外出就不外出,就是对社会做出的最大的贡献。 有些读者私下问我,窝了几天,有点颓丧,能否推荐几本书在家里看看。我花了一天的时间,挑选了 10 本我最喜欢的书,你可以挑选感兴趣的来读一读。读书不仅可以平复恐惧的压力,还可以对未来充满希望,毕竟苦难终将会...
Python实战:抓肺炎疫情实时数据,画2019-nCoV疫情地图
今天,群里白垩老师问如何用python画武汉肺炎疫情地图。白垩老师是研究海洋生态与地球生物的学者,国家重点实验室成员,于不惑之年学习python,实为我等学习楷模。先前我并没有关注武汉肺炎的具体数据,也没有画过类似的数据分布图。于是就拿了两个小时,专门研究了一下,遂成此文。
作为一个程序员,内存的这些硬核知识你必须懂!
我们之前讲过CPU,也说了CPU和内存的那点事儿,今天咱就再来说说有关内存,作为一个程序员,你必须要懂的哪那些硬核知识! 大白话聊一聊,很重要! 先来大白话的跟大家聊一聊,我们这里说的内存啊,其实就是说的我们电脑里面的内存条,所以嘞,内存就是内存条,数据要放在这上面才能被cpu读取从而做运算,还有硬盘,就是电脑中的C盘啥的,一个程序需要运行的话需要向内存申请一块独立的内存空间,这个程序本身是存放在...
非典逼出了淘宝和京东,新冠病毒能够逼出什么?
loonggg读完需要5分钟速读仅需 2 分钟大家好,我是你们的校长。我知道大家在家里都憋坏了,大家可能相对于封闭在家里“坐月子”,更希望能够早日上班。今天我带着大家换个思路来聊一个问题...
牛逼!一行代码居然能解决这么多曾经困扰我半天的算法题
春节假期这么长,干啥最好?当然是折腾一些算法题了,下面给大家讲几道一行代码就能解决的算法题,当然,我相信这些算法题你都做过,不过就算做过,也是可以看一看滴,毕竟,你当初大概率不是一行代码解决的。 学会了一行代码解决,以后遇到面试官问起的话,就可以装逼了。 一、2 的幂次方 问题描述:判断一个整数 n 是否为 2 的幂次方 对于这道题,常规操作是不断这把这个数除以 2,然后判断是否有余数,直到 ...
用前端5分钟写一个在线m3u8在线播放器
&lt;!DOCTYPE html&gt; &lt;html lang="en"&gt; &lt;head&gt; &lt;meta charset="UTF-8"&gt; &lt;meta name="viewport" content="width=device-width, initial-scale=1.0"&gt; &lt;meta http-equiv="X...
立即提问