新手求助想做一个这样的网页
轮班牌的,当1#双击变红跳到后面的时候,其它列的1#全部变暗下来!再双击变黑后其它的列也自动变黑!每个号码代表一个员工。用什么环境比较好实现啊!
回复讨论(解决方案)
你这个需求很适合用jquery做...对于web开发者来说 你这应该叫 对dom进行操作
当点击任意一个编号时
第一条语句:当前1#变红,其他1#变灰
第二条语句:当前1#移到第五列 其他的向前递补
因为不知道你的dom结构,我假设一个
$("td").click(function(){ //点某个td时 var con = $(this).text(); //获取点的是哪个 $(this).css("color","red"); //当前的变红, $("td:contains('"+con+"')").not(this).css("color","grey"); //非当前的同内容的变灰 $(this).siblings().last().after($(this).clone()); //当前节点复制到最后 $(this).remove(); //当前节点删除});
晚上WOWing...不好给你测试 大致思路这样 应该还是不算难的.
你这个需求很适合用jquery做...对于web开发者来说 你这应该叫 对dom进行操作
当点击任意一个编号时
第一条语句:当前1#变红,其他1#变灰
第二条语句:当前1#移到第五列 其他的向前递补
因为不知道你的dom结构,我假设一个
$("td").click(function(){ //点某个td时 var con = $(this).text(); //获取点的是哪个 $(this).css("color","red"); //当前的变红, $("td:contains('"+con+"')").not(this).css("color","grey"); //非当前的同内容的变灰 $(this).siblings().last().after($(this).clone()); //当前节点复制到最后 $(this).remove(); //当前节点删除});
晚上WOWing...不好给你测试 大致思路这样 应该还是不算难的.
谢谢!可以帮我做一个吗?
用JS做前端,每一个编号是一个DIV,一个DIV给一个单独的ID,相同编号的DIV给同一个class
双击之后与这个class同名的其它DIV全部变为灰色,然后单独给这个被双击的DIV配一个红色就行
至于移动的效果,DIV的宽度是一样的,所以直接改变距离左边的距离就可以了
用JS做前端,每一个编号是一个DIV,一个DIV给一个单独的ID,相同编号的DIV给同一个class
双击之后与这个class同名的其它DIV全部变为灰色,然后单独给这个被双击的DIV配一个红色就行
至于移动的效果,DIV的宽度是一样的,所以直接改变距离左边的距离就可以了
我菜的不能再菜了!建网站就会弄!写源码真心是才学不到一星期啊,学习资料下了很多,搞的头大了!可以直接做一个让我借鉴学习吗?
恩 刚才看到你的站内信 给你写了个小demo
http://www.colg.biz/demo/d2.html
按照你的需求来的
当1#双击变红跳到后面的时候,其它列的1#全部变暗下来!再双击变黑后其它的列也自动变黑!
全部代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <meta charset="utf-8"><title> test</title><style></style><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script><script language="javascript">$(document).ready(function(){ $("td").live("dblclick",function(){ //点某个td时 var con = $(this).text(); //获取点的是哪个 if($(this).hasClass("red")){ $(this).css("color","black").removeClass("red"); //当前的变红, $("td:contains('"+con+"')").not(this).css("color","black").removeClass("red"); //非当前的同内容的变灰 }else{ $(this).css("color","red").addClass("red"); //当前的变红, $("td:contains('"+con+"')").not(this).css("color","grey").removeClass("red"); //非当前的同内容的变灰 $(this).siblings().last().after($(this).clone()); //当前节点复制到最后 $(this).remove(); //当前节点删除 } });});</script></head><body>给CSDN http://bbs.csdn.net/topics/390536589 做的demo<table border=1 width=400> <th> <td colspan="6">工作流水</td> </th> <tr> <td>项目1</td> <td>1#</td> <td>2#</td> <td>3#</td> <td>4#</td> <td>5#</td> <tr> <tr> <td>项目2</td> <td>1#</td> <td>2#</td> <td>3#</td> <td></td> <td></td> <tr> <tr> <td>项目3</td> <td>1#</td> <td>2#</td> <td></td> <td></td> <td>5#</td> <tr> <tr> <td>项目4</td> <td>1#</td> <td>2#</td> <td>3#</td> <td>4#</td> <td>5#</td> <tr> <tr> <td>项目5</td> <td>1#</td> <td>2#</td> <td></td> <td>4#</td> <td></td> <tr> <tr> <td>项目6</td> <td>1#</td> <td>2#</td> <td>3#</td> <td>4#</td> <td>5#</td> <tr> <tr> <td>项目7</td> <td>1#</td> <td></td> <td>3#</td> <td></td> <td>5#</td> <tr> <tr> <td>项目8</td> <td>1#</td> <td>2#</td> <td>3#</td> <td>4#</td> <td>5#</td> <tr></table></body></html>
通过js控制css样子,如果你会写js,这个问题解决就可解决。
恩 刚才看到你的站内信 给你写了个小demo
http://www.colg.biz/demo/d2.html
按照你的需求来的
当1#双击变红跳到后面的时候,其它列的1#全部变暗下来!再双击变黑后其它的列也自动变黑!
全部代码
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html> <head> <title> New Document </title> <meta name="Generator" content="EditPlus"> <meta name="Author" content=""> <meta name="Keywords" content=""> <meta name="Description" content=""> <meta charset="utf-8"><title> test</title><style></style><script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js" type="text/javascript"></script><script language="javascript">$(document).ready(function(){ $("td").live("dblclick",function(){ //点某个td时 var con = $(this).text(); //获取点的是哪个 if($(this).hasClass("red")){ $(this).css("color","black").removeClass("red"); //当前的变红, $("td:contains('"+con+"')").not(this).css("color","black").removeClass("red"); //非当前的同内容的变灰 }else{ $(this).css("color","red").addClass("red"); //当前的变红, $("td:contains('"+con+"')").not(this).css("color","grey").removeClass("red"); //非当前的同内容的变灰 $(this).siblings().last().after($(this).clone()); //当前节点复制到最后 $(this).remove(); //当前节点删除 } });});</script></head><body>给CSDN http://bbs.csdn.net/topics/390536589 做的demo<table border=1 width=400> <th> <td colspan="6">工作流水</td> </th> <tr> <td>项目1</td> <td>1#</td> <td>2#</td> <td>3#</td> <td>4#</td> <td>5#</td> <tr> <tr> <td>项目2</td> <td>1#</td> <td>2#</td> <td>3#</td> <td></td> <td></td> <tr> <tr> <td>项目3</td> <td>1#</td> <td>2#</td> <td></td> <td></td> <td>5#</td> <tr> <tr> <td>项目4</td> <td>1#</td> <td>2#</td> <td>3#</td> <td>4#</td> <td>5#</td> <tr> <tr> <td>项目5</td> <td>1#</td> <td>2#</td> <td></td> <td>4#</td> <td></td> <tr> <tr> <td>项目6</td> <td>1#</td> <td>2#</td> <td>3#</td> <td>4#</td> <td>5#</td> <tr> <tr> <td>项目7</td> <td>1#</td> <td></td> <td>3#</td> <td></td> <td>5#</td> <tr> <tr> <td>项目8</td> <td>1#</td> <td>2#</td> <td>3#</td> <td>4#</td> <td>5#</td> <tr></table></body></html>
谢谢!
项目那个也会动我改了下
nbsp;HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<script></script>
<script> <br /> $(document).ready(function(){ <br /> $("td").live("dblclick",function(){ //点某个td时 <br /> var con = $(this).text(); //获取点的是哪个 <br /> if($(this).hasClass("red")){ <br /> $(this).css("color","black").removeClass("red"); //当前的变红, <br /> $("td:contains('"+con+"')").not(this).css("color","black").removeClass("red"); //非当前的同内容的变灰 <br /> }else{ <br /> $(this).css("color","red").addClass("red"); //当前的变红, <br /> $("td:contains('"+con+"')").not(this).css("color","grey").removeClass("red"); //非当前的同内容的变灰 <br /> $(this).siblings().last().after($(this).clone()); //当前节点复制到最后 <br /> $(this).remove(); //当前节点删除 <br /> } <br /> }); <br /> }); <br /> </script>
|
美雅剪烫工作流水双击跳牌,双击红色开牌,红色代表该项目在忙,灰色表示该项目没空接 | ||||||||
---|---|---|---|---|---|---|---|---|---|
女宾剪吹 | 5号欧文 | 6号冬冬 | 3号杨松 | 9号杨威 | 18号小赵 | ||||
女宾设计 | 5号欧文 | 6号冬冬 | 3号杨松 | 9号杨威 | 18号小赵 | ||||
男宾剪吹 | 18号小赵 | 2号张柳 | 9号杨威 | 7号威 | 3号杨松 | ||||
男宾设计 | 2号张柳 | 18号小赵 | 9号杨威 | 3号杨松 | 28号欧阳 | ||||
技师烫发 | 22号妙君 | 17号邓磊 | 19号石兵 | ||||||
技师染发 | 22号妙君 | 17号邓磊 | 19号石兵 | ||||||
技师洗头 | 24号海燕 | 22号妙君 | 26号巧凤 | 11号熊芳 | 25号欣泓 | 16号华娟 | 17号邓磊 | 19号石兵 | 12号松余 |
接待 | 24号海燕 | 22号妙君 | 26号巧凤 | 11号熊芳 | 25号欣泓 | 16号华娟 | 17号邓磊 | 19号石兵 | 12号松余 |
如果要实现多个页面同步,不要一刷新就还原了!要用什么代码呢?
多页面同步 那就将排序后的结果存入数据库 要显示的地方从数据库读取 生成 不就可以了吗?
多页面同步 那就将排序后的结果存入数据库 要显示的地方从数据库读取 生成 不就可以了吗?
数据库??B/S啊!
多页面同步 那就将排序后的结果存入数据库 要显示的地方从数据库读取 生成 不就可以了吗?
数据库??B/S啊! 听说过没见过啊!
那你描述下你多个页面同步的这个需求大概啥样的 ...
呼唤高手来看下... 不依靠后端我还真不知道怎么做这个...

熱AI工具

Undresser.AI Undress
人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover
用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool
免費脫衣圖片

Clothoff.io
AI脫衣器

Video Face Swap
使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

熱工具

記事本++7.3.1
好用且免費的程式碼編輯器

SublimeText3漢化版
中文版,非常好用

禪工作室 13.0.1
強大的PHP整合開發環境

Dreamweaver CS6
視覺化網頁開發工具

SublimeText3 Mac版
神級程式碼編輯軟體(SublimeText3)

JWT是一種基於JSON的開放標準,用於在各方之間安全地傳輸信息,主要用於身份驗證和信息交換。 1.JWT由Header、Payload和Signature三部分組成。 2.JWT的工作原理包括生成JWT、驗證JWT和解析Payload三個步驟。 3.在PHP中使用JWT進行身份驗證時,可以生成和驗證JWT,並在高級用法中包含用戶角色和權限信息。 4.常見錯誤包括簽名驗證失敗、令牌過期和Payload過大,調試技巧包括使用調試工具和日誌記錄。 5.性能優化和最佳實踐包括使用合適的簽名算法、合理設置有效期、

會話劫持可以通過以下步驟實現:1.獲取會話ID,2.使用會話ID,3.保持會話活躍。在PHP中防範會話劫持的方法包括:1.使用session_regenerate_id()函數重新生成會話ID,2.通過數據庫存儲會話數據,3.確保所有會話數據通過HTTPS傳輸。

SOLID原則在PHP開發中的應用包括:1.單一職責原則(SRP):每個類只負責一個功能。 2.開閉原則(OCP):通過擴展而非修改實現變化。 3.里氏替換原則(LSP):子類可替換基類而不影響程序正確性。 4.接口隔離原則(ISP):使用細粒度接口避免依賴不使用的方法。 5.依賴倒置原則(DIP):高低層次模塊都依賴於抽象,通過依賴注入實現。

在PHPStorm中如何進行CLI模式的調試?在使用PHPStorm進行開發時,有時我們需要在命令行界面(CLI)模式下調試PHP�...

如何在系統重啟後自動設置unixsocket的權限每次系統重啟後,我們都需要執行以下命令來修改unixsocket的權限:sudo...

靜態綁定(static::)在PHP中實現晚期靜態綁定(LSB),允許在靜態上下文中引用調用類而非定義類。 1)解析過程在運行時進行,2)在繼承關係中向上查找調用類,3)可能帶來性能開銷。
