0

私がやりたいことはすべて (PHP を使えば十分に簡単ですが、スクリプトを変更してスクリプトの動作を理解することで、JavaScript と jQuery とフロント エンドのコーディングを今すぐ学習するように自分自身をプッシュしています) は、同じフォームを作成することです。前のフォームから「座席」変数が規定する行数。次に、登録者は、招待するゲストの名前を入力できます。cloneNode 機能を使用しようとしています。しかし、このスクリプトに含まれる [行の追加] フォーム ボタンを使用せずに作成される行数を規定する方法を理解するには、ここで何が起こっているのかを理解できません。

ここに私が取り組んでいるコードがあります。変数名「seats」を、作成された行数と等しくしたいだけです。ありがとう！：

   <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"  "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<title>Guest Registration</title>

<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">

<meta http-equiv="Content-Style-Type" content="text/css">

<meta http-equiv="Content-Script-Type" content="text/javascript">

<script type="text/javascript">

var clone;

function addRow(but){

var tbo=but.parentNode.parentNode.parentNode;

tbo.appendChild(clone);

var rows=tbo.getElementsByTagName('tr');
textAreas = getVar("seats");

clone=rows[rows.length-1].cloneNode(true);

orderNames(rows)

}

function removeRow(but){

var thisRow=but.parentNode.parentNode;

var tbo=thisRow.parentNode;

tbo.removeChild(thisRow);

var rows=tbo.getElementsByTagName('tr');

orderNames(rows)

}

function orderNames(rows){
var r = 4;
var i=0,r,j,inp,t,k;


    while(r=rows[i++]){

        inp=r.getElementsByTagName('input');j=0;k=1;

        while(t=inp[j++]){

        if(t.type=="text"){t.name='col_'+k+'_row_'+i;k++;}

        }

    }

}

/*onload=function(){


clone=document.getElementById('mytab').getElementsByTagName('tr')[0].cloneNode(true)

}*/

function getVar(name)
         {
         get_string = document.location.search;         
         return_value = '';

         do { //This loop is made to catch all instances of any get variable.
            name_index = get_string.indexOf(name + '=');
            //alert (name);

            if(name_index != -1)
              {
              get_string = get_string.substr(name_index + name.length + 1, get_string.length - name_index);

              end_of_value = get_string.indexOf('&');
              if(end_of_value != -1)                
                value = get_string.substr(0, end_of_value);                
              else                
                value = get_string;                

              if(return_value == '' || value == '')
                 return_value += value;
              else
                 return_value += ', ' + value;
              }
            } while(name_index != -1)

         //Restores all the blank spaces.
         space = return_value.indexOf('+');
         while(space != -1)
              { 
              return_value = return_value.substr(0, space) + ' ' + 
              return_value.substr(space + 1, return_value.length);

              space = return_value.indexOf('+');
              }

         return(return_value);        
         }



</script>

</head>

<body>

<form action="">
<script>
onload=function(){

 for(i=0; i<4; i++)
clone=document.getElementById('names').getElementsByTagName('tr')[0].cloneNode(true)

addRow(this)


}
</script>

<table width="600" border="1" cellpadding="0" cellspacing="0" id="names">

<tr>

<td>Attendee First Name:<input type="text" name="col_1_row_1" value="Enter First Name"></td>

<td>Attendee Last Name:<input type="text" name="col_2_row_1" value="Enter Last Name"></td>

<td>Attendee Badge Name:<input type="text" name="col_3_row_1" value="Enter Badge Name Name"></td>

<td>Attendee Email Address:<input type="text" name="col_4_row_1" value="Enter Email"></td>

<td><input type="button" value="ADD NEW ROW" onclick="addRow(this)"><br><br>

<input type="button" value="REMOVE THIS ROW" onclick="removeRow(this)"></td>

</tr>

</table>


</form>

</body>

</html>
4

1 に答える 1

0

「for」ステートメントを使用することもできます。たとえば（しゃれた意図はありません）：

function addRow(seats)
  htmlValue=document.forms[0].innerHTML;
  for(i=seats;i<=0;i--)
  {
    htmlValue=htmlValue+"<input type='text' id='seat"+i"'/>";
    document.forms[0].innerHTML=htmlValue;
  }
}

基本的に、上記の関数は変数 'i' の値を 'seats' と同じ値に設定し、一意の ID を持つ新しいフォーム要素を作成し、それをフォームの既存のコンテンツに追加します。i から 1 が減算され、i = 0 になるまでプロセスが繰り返されます。デフォルトでは、ページの最初のフォーム (forms[0]) にアクセスし、2 番目のフォームを選択し、forms[1] を使用します。

フォームには、それぞれが一意の ID を持つ 'seats' 数の行が表示されます。これがあなたの言いたいことですよね？

于 2010-10-14T01:30:26.387 に答える