Js を使用して、myself_javascript スキルによって作成されたテーブルの例を動的に追加します

コードをコピー コードは次のとおりです:

function addEvent (o,c,h){
if(o.attachEvent){
o.attachEvent('on' c,h);
o.addEventListener(c,h,false);
}
return true;}
var selectRow;//選択された行を保存して、ポップアップウィンドウ 行割り当て
function addnode()
{
var table=document.getElementById("Dy_table");
var tr=table.insertRow(); tr.insertCell();
var cell1=tr.insertCell();
var cell3=tr.insertCell(); insertCell();
var cell5=tr.insertCell();
var cell7=tr.insertCell() );
var cell9=tr.insertCell();
var hidden1=document.createElement("") ;
var hidden2=document.createElement("");
var hidden3=document.createElement("");
var hidden4=document.createElement("");//行ステータス
var hidden5=document .createElement("");//単価を非表示
var input1=document.createElement("");
var input2=document.createElement("");
var input3=document.createElement("");
var input4=document.createElement("var input5=document.createElement("");
var input6 =document.createElement( "");
var input7=document.createElement("");
var input8=document.createElement("") ;
var input9=document.createElement("<入力タイプ='ボタン' 名前='del' 値='削除' クラス='入力ボタン' onclick='delnode1(this)' >")
var oOption1= document.createElement("オプション");
var oOption2=document.createElement("オプション");
var oOption3=document.createElement("オプション"); document.createElement(" オプション");
input6.options.add(oOption2);
input6.options.add(oOption3); options.add(oOption4 );
oOption1.innerText="契約部品";
oOption2.innerText="外部委託部品"; "外注部品" ";
oOption3.innerText="スペアパーツ部門";
oOption3.value="スペアパーツ部門";
oOption4.innerText="メーカー供給部品";
oOption4。 value="メーカー提供の部品 ";
var rowIndex;
var rowCount = table.rows[0].cells[0].getElementsByTagName("input") )[2].value ;//ユーザーに表示される行数
cell0.innerText=parseInt(rowCount) 1;
table.rows[0].cells[0].getElementsByTagName("input" )[2].value = parseInt( rowCount) 1;
hidden2.value = parseInt(table.rows[0].cells[0].getElementsByTagName("input")[1].value) 1; >table.rows[0].cells [0].getElementsByTagName("input")[1].value=hidden2.value;
cell1.appendChild(input1);
cell1.appendChild(hidden1);/ /製品コード
cell1.appendChild (hidden2);//内部シーケンス
cell1.appendChild(hidden3);//変更と削除に使用されるこの行のID
cell1.appendChild(hidden4);/ /この行のステータス
cell2.appendChild(input3);
cell4.appendChild(hidden5); appendChild(input5);
cell9.appendChild(input8);
cell7.appendChild(input7); =function(obj)
{
return function(){textChange(obj);}
}
var ttt=function(obj)
{
return function(){selectChange (obj);}
}
addEvent(input1,"change",tt(input1));
addEvent(input2,"change",tt(input1)); "変更",tt(input1)) ;
addEvent(input4,"change",tt(input1));
addEvent(input5,"change",tt(input1)); ,"change",ttt(input6) );
addEvent(input7,"change",tt(input1));
// addEvent(input8,"change",tt(input1)); }
function delnode()/ /削除時のイベント
{
var table=document.getElementById("Dy_table");
var rowCount = table.rows[0].cells[0]。 getElementsByTagName("input")[2 ].value;//ユーザーに表示される行の数
var row;//最後に表示される行を保存します
for( var i=table.rows.length-1 ; i>=0 ;i--)
{
if(table.rows[i].style.display!="none")
{
row=table.rows[i] ;
休憩
}
}
var rowId=row.cells[1].getElementsByTagName("input")[3].value;
if( rowCount > 1 )
{
if(rowId=="") //新しく追加された行がデータベースに書き込まれていない場合は、直接削除します
{
row.removeNode(true);
table.rows[0].cells[0].getElementsByTagName("input ")[ 2].value = parseInt(rowCount) - 1;
}
else//データベースから削除する必要がある場合は、削除マークを設定します
{
row.style. display="none";
row.cells[1].getElementsByTagName("input")[4].value = "2"; input")[2].value = parseInt(rowCount-1);
}
}
else
{
if(rowId == "")//新しい行がデータベースに書き込まれていません。クリアします
{
row.cells.item(1).getElementsByTagName("input")[0].value="";
row.cells.item(1) .getElementsByTagName("input")[1 ].value="";
row.cells.item(2).getElementsByTagName("input")[0].value="";
row.cells. item(3).getElementsByTagName("input ")[0].value="1";
row.cells.item(4).getElementsByTagName("input")[0].value=""; >row.cells.item(7) .getElementsByTagName("input")[0].value="";
row.cells.item(5).getElementsByTagName("input")[0].value=" ";
row.cells. item(6).getElementsByTagName("select")[0].selectedIndex=0;
}
else//データベースから削除する必要がある場合は、マークを削除します
{
row.style.display="none";
row.cells[1].getElementsByTagName("input")[4].value = "2"; rows[0].cells[0].getElementsByTagName(" input")[2].value = parseInt(rowCount) - 1;
addnode();
}
}
setClf() ;
}
function delnode1(o) //削除時のイベント
{
var tr=o.parentElement.parentElement;
var table=document.getElementById("Dy_table"); 🎜>var rowCount = table.rows[0].cells[0].getElementsByTagName("input")[2].value;//ユーザーに表示される行数
var rowId=tr.cells[1] ].getElementsByTagName("input")[3].value;
if( rowCount > 1 )
{
if(rowId=="")//新しく追加された行が書き込まれていない場合データベースを直接削除します。
{
tr.removeNode(true );
table.rows[0].cells[0].getElementsByTagName("input")[2].value = parseInt(rowCount) ) - 1;
}
else
{
tr.style.display="none";
tr.cells[1].getElementsByTagName("input")[4].value = "2";
table.rows[0].cells[0 ].getElementsByTagName("input")[2].value =
}
}
else
{
if(rowId=="")// 新しく追加された行がデータベースに書き込まれない場合は、それらを直接クリアします
{
tr.cells.item(1).getElementsByTagName ("input")[0].value="";
tr.cells.item(1).getElementsByTagName("input")[1].value=""; 2).getElementsByTagName("input")[0].value="";
tr.cells.item(3).getElementsByTagName("input")[0].value="1"; .cells.item(4).getElementsByTagName("input")[0].value=" ";
tr.cells.item(7).getElementsByTagName("input")[0].value="";
tr.cells.item(5).getElementsByTagName("input")[0] .value="";
tr.cells.item(6).getElementsByTagName("select")[0].selectedIndex =0;
}
else//データベースから削除する必要がある場合は、削除タグ
{
tr.style.display="none"; に置きます。 cell[1].getElementsByTagName("input")[4].value = "2";
table.rows[0].cells[0].getElementsByTagName("input")[2].value = parseInt( rowCount) - 1;
addnode();
}
}
// 以下のループは、中央から削除するときにテーブルの行番号を更新するために使用されます
rowCount = table.rows [0].cells[0].getElementsByTagName("input")[2].value;
for( var i= 1, p = 1; i
{
if(table.rows[i].style.display!="none")
{
table.rows [i].cells[0].innerText = p; 🎜>}
}
setClf();
}
//
関数 textChange(o)
{
setClf(); を変更したときに発生するイベントvar tr=o.parentElement.parentElement;
var rowState = tr.cells[1].getElementsByTagName("input")[4] .value
if( rowState == "1")
return; ;
else
tr.cells[1].getElementsByTagName("input")[4].value = "3";
}
//ドロップダウン ボックス オプションの変更 setClf()ここでは指定されていない金額を計算します。
function selectChange(o)
{
var tr=o.parentElement.parentElement;
var glf = tr.cells[7].getElementsByTagName("input ")[0];
var dj = tr.cells[4].getElementsByTagName("input")[0];
var dj1 = tr.cells[4].getElementsByTagName("input")[1 ];
if( o.selectedIndex==0)// コントラクト
{
glf.value='0.00';
dj.value=dj1.value();
return;
}
if( o.selectedIndex==1)//外注部品
{
glf.value='0.20';
dj.value=dj1.value ;
setClf();
return;
}
if( o.selectedIndex==2)// スペアパーツ部門
{
glf.value='0.00'; 🎜>dj.value=dj1.value;
setClf();
}
if( o .selectedIndex==3)//メーカー提供
{
glf .value='0.00';
dj.readOnly=true;
return;
//送信前にデータを検証して重複行がないことを確認します
function checkSameData()
{
var table=document.getElementById("Dy_table")
// var rowCount = table .rows[0].cells[0].getElementsByTagName("input")[2].value;//ユーザーに表示される行数
for( var i= 1; i < table.rows .length ;i )
{
if(table.rows[i].style.display == "none"||table.rows[i].cells[1].getElementsByTagName("input")[ 1].value == "") 続行;
for( var p= i 1; p < table.rows.length ;p )
{
if(table.rows[p].style .display == "none") 続行;
if(table.rows[i].cells[1].getElementsByTagName("input")[1].value.replace(/s $/g,"") ==
table.rows[p].cells[1].getElementsByTagName("input")[1].value.replace(/s $/g,""))
{alert("パーツ セクション内の項目が重複しているため、保存できません! ");return false;}
}
}
return true;
}
//パーツ ウィンドウが開いているかどうか
var DialogWin;
function selectLj( o)// パーツを選択
{
if(dialogWin == null)
{
selectRow = o.parentElement.parentElement;// 行を割り当てるグローバル変数
dialogWin = window.showModelessDialog("../jddgl/Select_lj.aspx",window,
"center:yes;dialogWidth:550px;dialogHeight:400px;help:no;status:no;" );
}
}

========
フロントページ

コードをコピー コードは次のとおりです:

input name='Dy_text_ljh' style='width:100px' ondblclick='selectLj(this)' onchange='textChange(this)' type='text' />







;td> 🎜>



このプロジェクトにはこの関数が必要で、私はこれの方が良いと思います (結局、私はこれを書くのに多くの時間を費やしましたが、笑) 友達ができることを願っています。改善と改善に役立つアドバイスをください。失敗作、FFと互換性なし、まずい！

このウェブサイトの声明

この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

脱衣画像を無料で

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AIヘンタイを無料で生成します。

もっと見る

人気の記事

R.E.P.O.説明されたエネルギー結晶と彼らが何をするか（黄色のクリスタル）

1 か月前 By 尊渡假赌尊渡假赌尊渡假赌

R.E.P.O.最高のグラフィック設定

1 か月前 By 尊渡假赌尊渡假赌尊渡假赌

アサシンのクリードシャドウズ：シーシェルリドルソリューション

3週間前 By DDD

Windows11 KB5054979の新しいものと更新の問題を修正する方法

2週間前 By DDD

Will R.E.P.O.クロスプレイがありますか？

1 か月前 By 尊渡假赌尊渡假赌尊渡假赌

もっと見る

ホットツール

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

神レベルのコード編集ソフト（SublimeText3）

もっと見る

ホットトピック

Gmailメールのログイン入り口はどこですか？

7549

15

CakePHP チュートリアル

1382

52

Steamのアカウント名の形式は何ですか

83

11

Win11 Activation Key Permanent

58

19

NYTの接続はヒントと回答です

22

90

もっと見る

Related knowledge

PPT テーブルに挿入される画像の形式を調整する手順 Mar 26, 2024 pm 04:16 PM

1. 新しい PPT ファイルを作成し、例として [PPT Tips] という名前を付けます。 2. [PPT Tips]をダブルクリックしてPPTファイルを開きます。 3. 例として 2 行 2 列の表を挿入します。 4. 表の境界線をダブルクリックすると、上部ツールバーに[デザイン]オプションが表示されます。 5. [シェーディング]オプションをクリックし、[画像]をクリックします。 6. [画像]をクリックすると、画像を背景にした塗りつぶしオプションダイアログボックスが表示されます。 7. ディレクトリ内で挿入したいトレイを見つけ、「OK」をクリックして画像を挿入します。 8. テーブル ボックスを右クリックして、設定ダイアログ ボックスを表示します。 9. [セルの書式設定]をクリックし、[画像を網掛けとして並べる]にチェックを入れます。 10. [中央]、[ミラー]など必要な機能を設定し、[OK]をクリックします。注: デフォルトでは、表に画像が入力されます。

売上予測表の作り方 Mar 20, 2024 pm 03:06 PM

帳票を上手に作成できることは、経理や人事、財務の分野だけでなく、多くの営業職にとっても帳票の作成を学ぶことは非常に重要です。なぜなら、販売に関連するデータは非常に大規模かつ複雑であり、問​​題を説明するために文書に単純に記録することはできないからです。より多くの営業マンがExcelを使った表作成に習熟できるよう、売上予測に関する表作成の課題を編集部が紹介しますので、お困りの友人は必見です！ 1. [売上予測・目標設定]xlsmを開き、各テーブルに格納されているデータを分析します。 2. 新規に[空のワークシート]を作成し、[セル]を選択し、[ラベル情報]を入力します。下に[ドラッグ]し、月を[塗りつぶします]。 [その他]のデータを入力し、[

条件に応じて色を自動変更するWPS値の設定方法_条件に応じて色を自動変更するWPSテーブル値の設定手順 Mar 27, 2024 pm 07:30 PM

1. ワークシートを開き、[スタート]-[条件付き書式]ボタンを見つけます。 2. [列の選択] をクリックし、条件付き書式を追加する列を選択します。 3. [条件付き書式]ボタンをクリックするとオプションメニューが表示されます。 4. [条件付きルールを強調表示]-[間]を選択します。 5. ルールを入力します: 20、24、濃い緑色のテキストと濃い塗りつぶし。 6. 確認後、選択した列のデータは、設定に従って対応する数値、テキスト、セル ボックスで色付けされます。 7. 競合のない条件付きルールは繰り返し追加できますが、競合するルールの場合、WPS は以前に確立された条件付きルールを最後に追加したルールに置き換えます。 8. [Between] ルール 20 ～ 24 と [Less than] 20 の後にセル列を繰り返し追加します。 9. ルールを変更する必要がある場合は、ルールをクリアしてからルールをリセットします。

JavaScript を使用してテーブルの列幅のドラッグ アンド ドロップ調整を実装するにはどうすればよいですか? Oct 21, 2023 am 08:14 AM

JavaScriptを使用してテーブルの列幅のドラッグアンドドロップ調整機能を実現するにはどうすればよいですか? Web テクノロジーの発展に伴い、Web ページ上に表形式で表示されるデータがますます増えています。ただし、表の列幅がニーズを満たせない場合があり、内容がオーバーフローしたり、幅が不足したりすることがあります。この問題を解決するには、JavaScript を使用してテーブルの列幅のドラッグ アンド ドロップ調整機能を実装し、ユーザーが必要に応じて列幅を自由に調整できるようにします。テーブルの列幅のドラッグ アンド ドロップ調整機能を実現するには、主に次の 3 つのポイントが必要です。

点線の外側に帳票が印刷できない場合はどうすればよいですか? Mar 28, 2023 am 11:38 AM

表が点線の外側に印刷できない問題の解決策: 1. Excel ファイルを開き、開いたページで「印刷」をクリックします; 2. プレビュー ページで「ズームなし」を見つけて、1 ページに調整することを選択します。 ; 3. 印刷するプリンターを選択します。ドキュメントがあれば十分です。

CSSで表の重複した枠線を削除する方法 Sep 29, 2021 pm 06:05 PM

CSS では、border-collapse 属性を使用して、表内の重複する枠線を削除できます。この属性は、表の枠線を 1 つの枠線に折りたたむか分離するかを設定できます。重なり合う枠線を結合するには、値を Collapse に設定するだけで済みます。 . 単一線の境界線の効果を実現する境界線になります。

Vue でテーブル データをエクスポートおよびインポートする方法 Oct 15, 2023 am 08:30 AM

Vue で表形式データのエクスポートとインポートを実装する方法には、特定のコード サンプルが必要です。Vue を使用して開発された Web プロジェクトでは、表形式データを Excel にエクスポートしたり、Excel ファイルをインポートしたりする必要がよく発生します。この記事では、Vue を使用してテーブル データのエクスポートおよびインポート機能を実装する方法と、具体的なコード例を紹介します。 1. テーブル データをエクスポートするためのインストールの依存関係 まず、Excel ファイルをエクスポートするためのいくつかの依存関係をインストールする必要があります。 Vue プロジェクトのコマンド ラインから次のコマンドを実行します: npmin

Wordの表を合計する方法を知っていますか? Mar 21, 2024 pm 01:10 PM

Word の表で数を数えるという問題に遭遇することがあります。通常、このような問題に遭遇すると、ほとんどの生徒は Word の表を Excel にコピーして計算しますが、黙って電卓を手に取る生徒もいます。簡単に計算する方法はありますか？もちろんありますが、実はWordでも合計額を計算することができます。それで、その方法を知っていますか？今日は、一緒に見ていきましょう！困っている友達はすぐに集めてください。手順の詳細: 1. まず、コンピューターで Word ソフトウェアを開き、処理する必要がある文書を開きます。 (図のように) 2. 次に、(図のように) 合計値が配置されているセルにカーソルを置き、[メニュー バー] をクリックします。

See all articles

福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！

私たちについて 免責事項 Sitemap

© php.cn All rights reserved

シリアル番号 <%--ページの状態- -%> 行数--%>

部品名

td>

単価

メーカー

素材の供給元

管理費 /td> 合計

1

契約パート アウトソーシングパート< option>スペアパーツ部門 メーカー供給パーツ< /td>