ホームページ > バックエンド開発 > PHPチュートリアル > 初心者が助けを求めています、このようなWebページを作りたいです

初心者が助けを求めています、このようなWebページを作りたいです

WBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWBOYWB
リリース: 2016-06-23 14:18:40
オリジナル
854 人が閲覧しました

シフトカードの場合、1# をダブルクリックして赤くなり、後ろにジャンプすると、他の列のすべての 1# が暗くなります。ダブルクリックして黒にすると、他の列も自動的に黒になります。各数字は従業員を表します。どの環境が導入しやすいでしょうか?


ディスカッションへの返信 (解決策)

あなたの要件は jquery の使用に非常に適しています... Web 開発者にとって、これは dom での操作と呼ばれるはずです

任意の番号がクリックされたとき

最初のステートメント : 現在の1# が赤に変わり、他の 1# が灰色に変わります
2 番目のステートメント: 現在の 1# が 5 番目の列に移動され、その他は前方に埋められます

あなたの 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();   //当前节点删除});
ログイン後にコピー
ログイン後にコピー
を想定します


すごいですね... あなたの代わりにテストすることはできません

あなたのニーズは jquery の使用に非常に適しています... Web 開発者にとっては、それは操作と呼ぶべきです。ドム上

クリック時 任意の数字を使用した場合

最初のステートメント: 現在の 1# が赤に変わり、他の 1# が灰色に変わります
2 番目のステートメント: 現在の 1# が 5 列目と他の 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();   //当前节点删除});
ログイン後にコピー
ログイン後にコピー



がすごいと思います... テストすることはできません 一般的な考えは、それが起こるべきではないということです。難しいですね

ありがとうございます!作ってもらえますか?

各番号は DIV として使用されます。同じ番号を持つ DIV は同じクラスに割り当てられます。このクラスは灰色になり、このキルトに個別に割り当てられます。ダブルクリックした DIV に赤色を追加するだけです
移動効果は、DIV の幅は同じなので、左への距離を変更するだけです。直接

フロントエンドとしてJSを使用し、各番号はDIVであり、DIVは別のIDであり、同じ番号を持つDIVは同じクラスに割り当てられます

ダブルクリック後、同じ名前を持つ他のすべてのDIVがこのクラスはグレーになり、ダブルクリックしたDIVのみに赤色を割り当てます
移動効果に関しては、DIVの幅は同じなので、左への距離を変更するだけです
それはできません。もう!ウェブサイトを構築するだけです!正直に言うと、大量の学習教材をダウンロードして、ソース コードの書き方を習得したのは 1 週間も経たないうちでした。私が学ぶために直接作成してもらえますか?

さて、あなたのサイトレターを見て、小さなデモを書きました


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 の外観を制御できる場合、この問題は解決できます。

恩 刚才看到你的站内信 给你写了个小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>
ログイン後にコピー
ログイン後にコピー



谢谢!
项目那个也会动我改了下


 
   美雅剪烫工作流水牌 
  
  
  
  
  

 test


















































技術者ヘアダイ
No.19 シビン
No.24 ハイヤン< /td; 25 シン・ホン 16 フア・ファン 17 デン・レイ No.

レセプション
No. 16 ホア・フアン

複数のページを同期しないでください。リフレッシュしました!どのようなコードを使用する必要がありますか?

複数ページ同期の場合は、ソート結果をデータベースに保存します。

複数ページ同期の場合、表示する場所はデータベースに保存されます。表示される場所は

データベースから読み込んで生成するだけで十分ではないでしょうか? ? BS!


複数ページの同期 次に、ソートされた結果をデータベースに保存し、表示されるデータベースから読み取って生成しますか?

データベース? ? BS! 聞いたことがありますか、見たことがありませんか?

それから、複数のページを同期する必要性について説明していただけますか...

専門家に電話して見てもらいましょう... バックエンドに依存せずにこれを行う方法が本当にわかりません...

ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート

美雅剪烫工作流水双击跳牌,双击红色开牌,红色代表该项目在忙,灰色表示该项目没空接
女宾剪吹 5号欧文 6号冬冬 3号杨松 9号杨威 18号小赵
女宾设计 5号欧文 6号冬冬 3号杨松 9号杨威 18号小赵
男宾剪吹 18号小赵 2号张柳 9号杨威 7号威 3号杨松
男宾设计 2号张柳 18号小赵 9号杨威 3号杨松 28号欧阳
技师烫发 ミャオジュン No.22 デン・レイ No.17
No. 17 Deng Lei
No. 12 ソンユ No. td>
No. 22 ミャオジュン No. >25シン・ホン No. < ;td>No. 12 Songyu