如何在javascript中为两个数组的每个循环使用一个

how to use one for each loop for two arrays in javascript?

本文关键字：循环 一个 数组 两个 javascript      更新时间：2024-02-25

在我的web应用程序中，我有多个名称相同的文本框。使用按钮点击事件，它将动态添加文本框。用户输入电子邮件地址。

下面的javascript显示，对于每个循环，它都会将用户输入的所有电子邮件地址保存在数据库中。

 function JavaScriptFunction() {   
 var arr = $("[name='multiple[]']");
 $.each(arr, function (i, item) { PageMethods.InsertContacts($(item).val(),"01132321","M0011", getValues_Success, getValues_Fail);
  });

这是我的网页

                        <div class="form-group multiple-form-group input-group">                           
                            <input type="text" name="multiple[]" class="form-control" />                          
                            <span class="input-group-btn">
                                <button type="button" class="btn btn-success btn-add">+</button>
                            </span>
                        </div>
                         <div class="form-group multiple-form-group input-group">                           
                            <input type="text" name="multiple[]Phone" class="form-control" />                          
                            <span class="input-group-btn">
                                <button type="button" class="btn btn-success btn-add">+</button>
                            </span>
                        </div>
                     <input type="button" onclick="JavaScriptFunction();" value="get Values" />

代码隐藏方法

  [WebMethod]
public static string InsertContacts(string email ,string phone, string username)
{
    userDataHandler.InsertContacts(email, phone, username);
    return "success";
}

同样，用户添加电话号码。我想读取数组并将数据保存在数据库中。我可以在两个循环中读取数组并保存数据。但我想在一个循环中读取这两个数组，并将数据保存在两列中。

我试过这样做，但不起作用。

var arr = $("[name='multiple[]']");
var arr2 = $("[name='multiple[]Phone']");
$.each(arr,arr2 function (i, item,item2) {
  PageMethods.InsertContacts($(item).val(),$(item2).val(),"M0011", getValues_Success, getValues_Fail);
});

如果它们的长度相同，那么在单个循环中是可能的。

var arr = $("[name='multiple[]']");
var arr2 = $("[name='multiple[]Phone']");
$.each(arr, function (i, item) {
  PageMethods.InsertContacts(arr[i].val(),arr2[i].val(),"M0011", getValues_Success, getValues_Fail);
});

如果它们的长度不同，则使用两个环路

$.each([arr, arr2], function() {
    $.each(this, function(i, v) {
        // do something
    });
});

这是我的html页面

<form roe="form" runat="server">
         <asp:ScriptManager ID="ScriptManager1" runat="server" EnablePageMethods="true" ScriptMode="Release" />
    <!--Header-->
    <UsersHeaderTP:UsersHeaderTN runat="server" ID="UserHeaderTN1" />
    <!--Page Content-->
    <div class="container1">
        <div class="row">
            <div class="container">
                <div class="stepwizard">
                    <div class="stepwizard-row setup-panel">
                        <div class="stepwizard-step">
                            <a href="#step-1" type="button" class="btn btn-primary btn-circle">1</a>
                            <p>Step 1</p>
                        </div>
                        <div class="stepwizard-step">
                            <a href="#step-2" type="button" class="btn btn-default btn-circle" disabled="disabled">2</a>
                            <p>Step 2</p>
                        </div>
                     <%--   <div class="stepwizard-step">
                            <a href="#step-3" type="button" class="btn btn-default btn-circle" disabled="disabled">3</a>
                            <p>Step 3</p>
                        </div>--%>
                    </div>
                </div>
                    <div class="row setup-content" id="step-1">
                        <div class="col-xs-12">
                            <div class="col-md-12">
                                <h3>Step 1</h3>

                             <div class="col-md-4">
                            <div class="contacts">
                                <label>Contacts:</label>
                                <div class="form-group multiple-form-group input-group">                           
                                    <input type="text" name="multiple[]" class="form-control" />                          
                                    <span class="input-group-btn">
                                        <button type="button" class="btn btn-success btn-add">+</button>
                                    </span>
                                </div>
                                 <div class="form-group multiple-form-group input-group">                           
                                    <input type="text" name="multiple[]Phone" class="form-control" />                          
                                    <span class="input-group-btn">
                                        <button type="button" class="btn btn-success btn-add">+</button>
                                    </span>
                                </div>
                             <input type="button" onclick="JavaScriptFunction();" value="get Values" />                              
                            </div>
                        </div>

                        </div>
                    </div>                      
            </div>
        </div>
    </div>
           <div id="div1"></div>
    <!-- Content -->
    <div class="container">
        <!-- Footer -->
        <footertp:footertn runat="server" id="HeaderTN1" />
    </div>
    </form>

没有一个输入，使用按钮点击事件会添加文本框。文本框名称相等。用户使用按钮点击事件输入添加电子邮件。

使用以下javascript，我保存了用户在每个文本框中输入的所有电子邮件地址。以同样的方式，用户添加电话号码。

 var arr = $("[name='multiple[]']");
    $.each(arr, function (i, item) {
   PageMethods.InsertContacts($(item).val(),"0111" ,"M0011", getValues_Success, getValues_Fail);
   });

以上代码有效。正如你所看到的，我已经写了"0111"。在那里我必须插入由用户添加的值。以下代码显示用户添加的电话号码，所有电话号码都会被保存。

var arr2 = $("[name='multiple[]Phone']");
    $.each(arr2, function (i, item) {
    PageMethods.InsertPhone($(item).val(), "M0011", getValues_Success, getValues_Fail);
   });

我单独完成了这个代码。但我想把电子邮件和电话号码的列表放到一个文件夹里。你能给我建议什么方法吗。

相关文章：