简体中文(ZH-CN) English(EN) 繁体中文(ZH-TW) 日本語(JA) 한국어(KO) Melayu(MS) Français(FR) Deutsch(DE)
ホームページ > ウェブフロントエンド > jsチュートリアル > 本文

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

WBOY
リリース： 2016-05-16 17:19:26
オリジナル
1000 人が閲覧しました
コードをコピー コードは次のとおりです:

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 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と互換性なし、まずい！
関連ラベル：
シート
ソース：php.cn
前の記事：入力ファイルで選択したファイルをクリアする 2 つの解決策_JavaScript スキル 次の記事：Mouse_JavaScript スキルでドラッグできる DIV 実装のアイデアとコード
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
著者別の最新記事
最新の問題
width プロパティを追加してコンテンツを左に移動します。 ボディに余白を設けました。 main {left margin: 200px; right margin: 200px; textalignment: center} テキストを1...
から 2024-04-06 22:01:35
0
3
816
Javafx でインライン CSS スタイルを動的に変更する アプリケーションが最大化されているときにペインの背景画像を変更しようとしています。私の背景はインライン CSS を使用して設定されています。スタイル用に 2 つの異なる変数と if...
から 2024-04-06 20:57:16
0
1
487
opentbs を使用して odt ファイルを生成するときに発生する問題: 同じキーの値が別の列ではなく同じ行に表示されます。 PHPでodtを作成するためにOpenTbsというライブラリを使っていますが、列と行が動的に生成されるので利用しています。行と列の作成方法は知っていますが、それらを整理する方法がわ...
から 2024-04-06 20:18:18
0
1
483
モバイル ビューで、ユーザーがリンクをクリックしたときにこのナビゲーション バーを閉じるにはどうすればよいですか? ユーザーがリンクをクリックして Web サイトを閲覧すると、ナビゲーション バーが閉じませんか?ナビゲーション バーを閉じるために、クリック イベント リスナーを各リンクに追加しよ...
から 2024-04-06 19:23:03
0
1
411
JavaScript を使用せずにクリック時に画像ソースを動的に変更する CSS のみのメソッド img:active{} のような CSS のみを使用して、マウスクリック時に画像の src を変更する必要があります
から 2024-04-06 19:25:49
0
1
505
関連トピック
詳細>
人気のおすすめ
人気のチュートリアル
詳細>
関連するチュートリアル
人気のおすすめ
最新のコース
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート
私たちについて 免責事項 Sitemap
PHP中国語ウェブサイト：福祉オンライン PHP トレーニング，PHP 学習者の迅速な成長を支援します！
シリアル番号 <%--ページの状態- -%>

行数--%>
部品名 td>
単価
 メーカー
 素材の供給元
 管理費
/td> 合計

1

< /td>