GORAGOD.com

freelance, web developer, web designer, hosting, domain name

ช่วยดูโค้ดให้หน่อย คับ คือ อยากสร้างตารางที่ใช้ keyup อะคับ

<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>







</head>



<body>

<form action="?">

<script type="text/javascript">

$(document).ready(function(){

    $("[name=cnt]").keyup(function(){

        var cnt = parseInt($(this).val()), a=0;

        var template = '<tr class="scholar" id="scholar_%d"><td width="60"><input type="text" name="brethren_num_study[%d]"id="brethren_num_study_%d" size="5" />  </td><td width="120">    <input type="text" name="brethren_sex_study[%d]" id="brethren_sex_study_%d" size="10" />  </td><td width="120">    <input type="text" name="brethren_old_study[%d]" id="brethren_old_study_%d" size="5" />   </td>  <td width="120">    <input type="text" name="brethren_year_study[%d]" id="brethren_year_study_%d" size="20" />  </td> <td width="120">    <input type="text" name="brethren_school_study[%d]" id="brethren_school_study_%d" size="20" />  </td>    </tr>';

        

        var now_scholar = parseInt($(".scholar").length);

        if(now_scholar < cnt){

            for(a=now_scholar+1; a<=cnt; a++){

                $("tbody").append(template.replace(/%d/g,a));

            } 

        }

        else if(now_scholar > cnt){

            for(a=cnt+1; a<=now_scholar; a++){

                $("#scholar_"+a).remove();

            } 

        }

    });

});

</script>


    <label >สมาชิกที่อายุต่ำกว่า 20</label><input name="cnt" type="text" size="2" maxlength="1"  id="one"/><br />

    <table border="1" width="550">

   

    <tbody >

                

          <tr id="a">

            <th width="37"><div align="center">คนที่</div></th>

            <th width="69"><div align="center">เพศ</div></th>

            <th width="34"><div align="center">อายุ</div></th>

            <th width="39"><div align="center">ชั้นปี</div></th>

            <th width="337"><div align="center">สถานที่การศึกษา</div></th>

       

        </tr>

           

     

        

            

       </tbody>

      

    </table>

    

    

    

    

    <script type="text/javascript">

$(document).ready(function(){

    $("[name=cnt2]").keyup(function(){

        var cnt2 = parseInt($(this).val()), i=0;

        var temp = '<tr class="scho" id="scho_%d"><td width="60"><input type="text" name="brethren_num_work[%d]"id="brethren_num_work_%d" size="4" />  </td><td width="120">    <input type="text" name="brethren_sex_work[%d]" id="brethren_sex_work_%d" size="8" />  </td><td width="120">    <input type="text" name="brethren_old_work[%d]" id="brethren_old_work_%d" size="4" />   </td>  <td width="120">    <input type="text" name="brethren_woot_work[%d]" id="brethren_woot_work_%d" size="8" />  </td> <td width="120">    <input type="text" name="brethren_workplace[%d]" id="brethren_workplace_%d" size="20" />  </td> <td width="120">    <input type="text" name="brethren_revenue_work[%d]" id="brethren_revenue_work_%d" size="15" />  </td>       </tr>';

        

        var now_scho = parseInt($(".scho").length);

        if(now_scho < cnt2){

            for(i=now_scho+1; i<=cnt2; i++){

                $("table thead").append(temp.replace(/%d/g,i));

            } 

        }

        else if(now_scho > cnt2){

            for(i=cnt2+1; i<=now_scho; i++){

                $("#scho_"+i).remove();

            } 

        }

    });

});

</script>


     <label >สมาชิกที่อายุมากกว่า 20</label><input name="cnt2" type="text" size="2" maxlength="1" id="two" /><br />

    <table   border="1" width="550">

    

      <thead >

           

          

            <th width="30"><div align="center">คนที่</div></th>

            <th width="60"><div align="center">เพศ</div></th>

            <th width="30"><div align="center">อายุ</div></th>

            <th width="90"><div align="center">วุฒิการศึกษา</div></th>

            <th width="120"><div align="center">สถานที่ทำงาน</div></th>

            <th width="86"><div align="center">รายได้เดือนละ</div></th>

          

          <tr>

      </thead>

       

    </table>

    

</form>









พอดีผมอยากได้ สองตารางนี้ ไป ใช้ อะ คับ  แต่เอาไปใช้ร่วมกับตารางอื่น มันมีปัญหาพังทั้งเว็บเลย  ควรแก้ไขยังไง คับ ต้องอ้าถึงอยังไงที่จะไม่กระทบตารางอื่นอะคับ
13 ก.ย. 2556 1 1,558

ถ้าไม่อยากมีปัญหา ก็ต้องกำหนด id หรือ name ไม่ให้ซ้ำกันครับ ในแต่ละตาราง และ ต้องกำหนดให้ ตาราง และ Javascript ต้องสัมพันธ์กันด้วยครับ เช่น ในตัวอย่าง จะมี name=cnt และ name=cnt2
#1
ความคิดเห็น
ไฟล์อัปโหลด ชนิด jpg, jpeg ขนาดไฟล์ไม่เกิน 2M
^