新手求助想做一个这样的网页
轮班牌的，当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 기반 앱
AI Clothes Remover
사진에서 옷을 제거하는 온라인 AI 도구입니다.
Undress AI Tool
무료로 이미지를 벗다
Clothoff.io
AI 옷 제거제
AI Hentai Generator
AI Hentai를 무료로 생성하십시오.
인기 기사
뜨거운 도구
메모장++7.3.1
사용하기 쉬운 무료 코드 편집기
SublimeText3 중국어 버전
중국어 버전, 사용하기 매우 쉽습니다.
스튜디오 13.0.1 보내기
강력한 PHP 통합 개발 환경
드림위버 CS6
시각적 웹 개발 도구
SublimeText3 Mac 버전
신 수준의 코드 편집 소프트웨어(SublimeText3)
뜨거운 주제
7318
9
1625
14
1349
46
1261
25
1209
29
11 최고의 PHP URL 쇼트너 스크립트 (무료 및 프리미엄)
Mar 03, 2025 am 10:49 AM
종종 키워드와 추적 매개 변수로 혼란스러워하는 긴 URL은 방문자를 방해 할 수 있습니다. URL 단축 스크립트는 솔루션을 제공하여 소셜 미디어 및 기타 플랫폼에 이상적인 간결한 링크를 만듭니다. 이 스크립트는 개별 웹 사이트 a에 유용합니다
Instagram API 소개
Mar 02, 2025 am 09:32 AM
Instagram은 2012 년 Facebook에서 유명한 인수에 이어 타사 사용을 위해 두 개의 API 세트를 채택했습니다. Instagram Graph API 및 Instagram Basic Display API입니다. 개발자는
Laravel의 플래시 세션 데이터로 작업합니다
Mar 12, 2025 pm 05:08 PM
Laravel은 직관적 인 플래시 방법을 사용하여 임시 세션 데이터 처리를 단순화합니다. 응용 프로그램에 간단한 메시지, 경고 또는 알림을 표시하는 데 적합합니다. 데이터는 기본적으로 후속 요청에만 지속됩니다. $ 요청-
Laravel Back End : Part 2, React가있는 React 앱 구축
Mar 04, 2025 am 09:33 AM
이것은 Laravel 백엔드가있는 React Application을 구축하는 데있어 시리즈의 두 번째이자 마지막 부분입니다. 이 시리즈의 첫 번째 부분에서는 기본 제품 목록 응용 프로그램을 위해 Laravel을 사용하여 편안한 API를 만들었습니다. 이 튜토리얼에서는 Dev가 될 것입니다
Laravel 테스트에서 단순화 된 HTTP 응답 조롱
Mar 12, 2025 pm 05:09 PM
Laravel은 간결한 HTTP 응답 시뮬레이션 구문을 제공하여 HTTP 상호 작용 테스트를 단순화합니다. 이 접근법은 테스트 시뮬레이션을보다 직관적으로 만들면서 코드 중복성을 크게 줄입니다. 기본 구현은 다양한 응답 유형 단축키를 제공합니다. Illuminate \ support \ Facades \ http를 사용하십시오. http :: 가짜 ([ 'google.com'=> 'Hello World', 'github.com'=> [ 'foo'=> 'bar'], 'forge.laravel.com'=>
PHP의 컬 : REST API에서 PHP Curl Extension 사용 방법
Mar 14, 2025 am 11:42 AM
PHP 클라이언트 URL (CURL) 확장자는 개발자를위한 강력한 도구이며 원격 서버 및 REST API와의 원활한 상호 작용을 가능하게합니다. PHP CURL은 존경받는 다중 프로모토콜 파일 전송 라이브러리 인 Libcurl을 활용하여 효율적인 execu를 용이하게합니다.
Codecanyon에서 12 개의 최고의 PHP 채팅 스크립트
Mar 13, 2025 pm 12:08 PM
고객의 가장 긴급한 문제에 실시간 인스턴트 솔루션을 제공하고 싶습니까? 라이브 채팅을 통해 고객과 실시간 대화를 나누고 문제를 즉시 해결할 수 있습니다. 그것은 당신이 당신의 관습에 더 빠른 서비스를 제공 할 수 있도록합니다.
2025 PHP 상황 조사 발표
Mar 03, 2025 pm 04:20 PM
2025 PHP Landscape Survey는 현재 PHP 개발 동향을 조사합니다. 개발자와 비즈니스에 대한 통찰력을 제공하는 프레임 워크 사용, 배포 방법 및 과제를 탐색합니다. 이 조사는 현대 PHP Versio의 성장을 예상합니다
