如何使用 jquery 使简单循环不同的值表单输入元素

【问题标题】：How to Make Simple Looping a Different value A Form input Element With jquery如何使用 jquery 使简单循环不同的值表单输入元素
【发布时间】：2014-02-18 20:30:38
【问题描述】：

我想在 jquery 中创建简单的循环这个数据，我该怎么做？

这是我的代码：

HTML 代码：

<tr><td>FIRST HOSTNAME SERVER *</td><td>:</td><td>

<input type="text" onkeypress='validate(event)' name="id_server" id="id_server" value="" class="input-read-only" size="60" readonly="true">

<a href="<?php echo base_url(); ?>port/select_data_server" class="select"> SELECT FIRST HOSTNAME SERVER </a></td></tr>

<tr><td>PORT & CARD EQUIPMENT </td><td>:</td><td> 
   <?php 
     for ($a=1; $a<=15; $a++)
        {
   ?>



  <div id="form<?=$a?>">    <form>
      PORT <?=$a?> : <input type="text" name="form1_input1" id="form<?=$a?>_input1" class="input-read-only" value="<?= $port?>"
  /><br><br> 
      CARD <?=$a?> : <input type="text" name="form1_input2" id="form<?=$a?>_input2"  class="input-read-only" value="<?=
  $card_equipment?>" /><br><br>    <input type="button" value="SAVE
  DATA" name="save" id="save<?=$a?>" class="btn-kirim-login" /><br><br> 
      </form>            </div>

    <?php  
      }

    ?> 
  </td>
    </tr>

  <tr><td>HOSTNAME CONNECTION & PORT  * </td><td>:</td><td>
  <input type="text" onkeypress='validate(event)' name="id_connection" id="id_connection" value="<?php echo $id_connection; ?>" class="input-read-only" size="60"  >

 <a href="<?php echo base_url(); ?>port/select_data_connection" class="select"> SELECT CONNECTION </a></td></tr>


</table>

<input type="hidden" name="stts" value="<?php echo $stts; ?>" id="stts">

还有这个 Javascript/Jquery 代码：

<script type="text/javascript">  
    $(document).ready(function() {
    $("#form2").hide(); // hides form2 and form3 elements on document load
    $("#form3").hide();
    $("#form4").hide();
    $("#form5").hide();
    $("#form6").hide();
    $("#form7").hide();
    $("#form8").hide();
    $("#form9").hide();
    $("#form10").hide();
    $("#form11").hide();
    $("#form12").hide();
    $("#form13").hide();
    $("#form14").hide();
    $("#form15").hide(); 
    $("#form16").hide();
    $("#form17").hide();
    $("#form18").hide();
    $("#form19").hide();
    $("#form20").hide();
    $("#form21").hide();
    $("#form22").hide();
    $("#form23").hide();
    $("#form24").hide();
    $("#form25").hide();
    $("#form26").hide();
    $("#form27").hide();
    $("#form28").hide();
    $("#form29").hide();
    $("#form30").hide();



    $("#save1").click(function() {

        var stts         =  $("#stts").val(); // retrieve values from input
        var id_server    =  $("#id_server").val(); // retrieve values from input
        var id_connection    =  $("#id_connection").val(); // retrieve values from input
        var form_input1  =  $("#form1_input1").val(); // retrieve values from input
        var form_input2  =  $("#form1_input2").val();
        var id_port      =  $("#id_port").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

            else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }   


            $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts, id_port:id_port },
               function(data){

                    if (id_port == ''){

                    $("#form2").show(); 

                    }else
                    {

                        alert('UPDATE SUCCESS');

                    }

                   $("#save1").hide();  


        });
    }); 


      $("#save2").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server   =   $("#id_server").val(); // retrieve values from input
        var id_connection    =  $("#id_connection").val();
        var form_input1 =   $("#form2_input1").val(); // retrieve values from input
        var form_input2 =   $("#form2_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }                   




            $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form3").show();   
                    $("#save2").hide(); 


        });
    });


      $("#save3").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server   =   $("#id_server").val(); // retrieve values from input
        var id_connection    =  $("#id_connection").val();
       var form_input1 = $("#form3_input1").val(); // retrieve values from input
        var form_input2 = $("#form3_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }

                    else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           


             $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form4").show();
                    $("#save3").hide(); 


        });
    });


      $("#save4").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
        var id_connection    =  $("#id_connection").val();
        var form_input1 = $("#form4_input1").val(); // retrieve values from input
        var form_input2 = $("#form4_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           


             $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form5").show(); 
                    $("#save4").hide(); 


        });
    });

      $("#save5").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
        var id_connection    =  $("#id_connection").val();
        var form_input1 = $("#form5_input1").val(); // retrieve values from input
        var form_input2 = $("#form5_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           


            $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form6").show();   
                    $("#save5").hide(); 


        });
    });



      $("#save6").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
        var id_connection    =  $("#id_connection").val();
       var form_input1 = $("#form6_input1").val(); // retrieve values from input
        var form_input2 = $("#form6_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }
                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           


             $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form7").show();    
                    $("#save6").hide(); 


        });
    });


      $("#save7").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
        var id_connection    =  $("#id_connection").val();
       var form_input1 = $("#form7_input1").val(); // retrieve values from input
        var form_input2 = $("#form7_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           


            $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form8").show(); 
                    $("#save7").hide(); 


        });
    });

      $("#save8").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
        var id_connection    =  $("#id_connection").val();       
       var form_input1 = $("#form8_input1").val(); // retrieve values from input
        var form_input2 = $("#form8_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           


            $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form9").show(); 
                    $("#save8").hide(); 


        });
    });



      $("#save9").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
        var id_connection    =  $("#id_connection").val();
        var form_input1 = $("#form9_input1").val(); // retrieve values from input
        var form_input2 = $("#form9_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   


                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           

            $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form10").show();  
                    $("#save9").hide(); 


        });
    });

      $("#save10").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
        var id_connection    =  $("#id_connection").val();
        var form_input1 = $("#form10_input1").val(); // retrieve values from input
        var form_input2 = $("#form10_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           


            $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form11").show();   
                    $("#save10").hide(); 


        });
    });

      $("#save11").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
var id_connection    =  $("#id_connection").val();       
       var form_input1 = $("#form11_input1").val(); // retrieve values from input
        var form_input2 = $("#form11_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           


            $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form12").show();   
                    $("#save11").hide(); 


        });
    });

      $("#save12").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
       var id_connection     =  $("#id_connection").val();
       var form_input1 = $("#form12_input1").val(); // retrieve values from input
        var form_input2 = $("#form12_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }
                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           


            $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form13").show();   
                    $("#save12").hide(); 


        });
    });

      $("#save13").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
       var id_connection     =  $("#id_connection").val();
       var form_input1 = $("#form13_input1").val(); // retrieve values from input
        var form_input2 = $("#form13_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           

             $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form14").show();   
                    $("#save13").hide(); 


        });
    });


      $("#save14").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
       var id_connection     =  $("#id_connection").val();
       var form_input1 = $("#form14_input1").val(); // retrieve values from input
        var form_input2 = $("#form14_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           

            $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 

                   $("#form15").show();    
                    $("#save14").hide(); 


        });
    });

      $("#save15").click(function() {

        var stts        =   $("#stts").val(); // retrieve values from input
        var id_server =     $("#id_server").val(); // retrieve values from input
        var id_connection   =   $("#id_connection").val();
        var form_input1 = $("#form15_input1").val(); // retrieve values from input
        var form_input2 = $("#form15_input2").val();

        if (id_server == '')
                {
                    alert('FIRST HOSTNAME SERVER REQUIRED');

                return false;
                }

                else if (id_connection == '')
                {
                    alert('HOSTNAME CONNECTION REQUIRED');

                return false;
                }   

                else if (form_input1 == '')
                {
                    alert('PORT REQUIRED');

                return false;
                }           


             $.post("<?=base_url()?>port/save", { id_server: id_server, id_connection: id_connection, form_input1:form_input1, form_input2:form_input2, stts: stts },
               function(data){ 


                   $("#form16").show(); 
                   $("#save15").hide(); 

        });
    });

});

</script>

我觉得我的 javascript/jquery 代码不好，如何修复？

【问题讨论】：

  • 我没听懂你...

标签： php jquery html mysql codeigniter


【解决方案1】：

如果你知道确切的数字，比如 30，正如 kumar 告诉你的，你可以使用下面的脚本

for (var i = 1; i <= 30; i++)  
    {  
        $('#form'+i).hide();  
    }

【讨论】：

    【解决方案2】：

    假设您想使用 jquery，您可以使用 .each 方法遍历每个表单元素。

    这样的……

    $('form').each(function(){
    $(this).hide();
});

    【讨论】：

    • 谢谢，表格是隐藏表格很好，但是如何循环保存1，保存2，保存3和其他，在保存属性/元素时，它的不同先生，如何循环？！ ——
    【解决方案3】：

    简单的循环应该可以做到（我假设你想隐藏它们，你的问题不清楚）：

     for (var i = 1; i <= 30; i++)  
    {  
        $('#form'+i).hide();  
    }

    【讨论】：

    • 谢谢，表格是隐藏表格很好，但是如何循环保存1，保存2，保存3和其他，在保存属性/元素不同的先生，如何循环？！
    • 我仍然不确定您要做什么，也许这会对您有所帮助：link
    猜你喜欢
    • 2015-05-22
    • 2020-03-04
    • 2012-04-25
    • 2013-04-16
    • 2022-09-30
    • 2015-05-05
    • 2015-11-27
    • 1970-01-01
    • 2013-10-06
    相关资源
    最近更新 更多
    热门标签
    Java Python linux javascript Mysql C# Docker 算法 前端 SpringBoot Redis Vue spring 设计模式 .net core .net kubernetes c++ 数据库 数据结构 大数据 js 机器学习 微服务 Android Go 程序员 面试 JVM ASP.net core 云原生 人工智能 后端 PHP git CSS golang k8s Nginx Django mybatis 深度学习 多线程 React 架构 devops 爬虫 云计算 Spring Boot LeetCode