选择在jquery中动态创建的id

时间:2016-05-22 16:46:14

标签: javascript jquery intel-xdk

我写了下面的jQuery代码,在这段代码中,当我点击#addbtn 2文本框时,下面的代码被创建

/* button  Submit */
$(document).on("click", ".uib_w_60", function(evt) {
  var foodid = [];
  var priceid = [];
  /* your code goes here */
  /* first I get id of .foodha class */
  $(".foodha").each(function() {
    var IDss = $(this).prop("id");
    foodid.push(IDss);

  });
  /*  second I get id of .priceha class */
  $(".priceha").each(function() {
    var pID = $(this).prop("id");
    priceid.push(pID);

  });

  var newfoodpriceid = [];
  /* here I dont know why the Id that gotten save
  twice in array, for example save with this pattern 
  [food_input2, food_input3, food_input2, food_input3]
  and to prevent this I use a trick and save it in another
  array with the code below: */

  for (var c = 0; c < priceid.length / 2; c++) {
    newfoodpriceid.push({
      'foodid': foodid[c],
      'priceid': priceid[c]
    });

  }

  /* then I want to get value of text box with exact
     id that I select with jQuery selector but the
     selector isn't working and the returned value
     is nothing but I enter a value in text box that
     have below id: */
  var pr = $("#" + newfoodpriceid[0].priceid).val();
  $("p").text(pr);
});

这段代码很好用,但是当我想选择用上面的代码添加的文本框来获取它们的内容时,id的选择器是不工作的,下面是我用来获取的代码这些文本框的价值:

<div class="grid grid-pad urow uib_row_42 row-height-42" data-uib="layout/row" data-ver="0">
  <div class="col uib_col_46 col-0_1-12_1-7" data-uib="layout/col" data-ver="0">
    <div class="widget-container content-area vertical-col center">
      <div class="add_checkbox" style="margin-top:5px"></div>
      <span class="uib_shim"></span>
    </div>
  </div>
  <div class="col uib_col_48 col-0_6-12_6-7" data-uib="layout/col" data-ver="0">
    <div class="widget-container content-area vertical-col">
      <div class="add_food"></div>
      <span class="uib_shim"></span>
    </div>
  </div>
  <div class="col uib_col_47 col-0_5-12_5-5" data-uib="layout/col" data-ver="0">
    <div class="widget-container content-area vertical-col">

      <div class="add_price"></div>
      <span class="uib_shim"></span>
    </div>
  </div>

  <span class="uib_shim"></span>
</div>

我解释一下我认为你需要知道的事情。

单击addbtn添加文本框之前的HTML代码:

<div class="add_food">
  <input class="wide-control form-control default input-sm foodha" type="text" placeholder="Food" id="food_input2" style="margin-bottom:5px;">
  <input class="wide-control form-control default input-sm foodha" type="text" placeholder="Food" id="food_input3" style="margin-bottom:5px;">
</div>

<div class="add_price">
  <input class="wide-control form-control default input-sm priceha" type="text" placeholder="Price" id="price_input2" style="margin-bottom:5px;">
  <input class="wide-control form-control default input-sm priceha" type="text" placeholder="Price" id="price_input3" style="margin-bottom:5px;">
</div>

点击&#34后的HTML代码;添加btn&#34;两次

#include <iostream>
#include <string>
#include <string.h>
#include <stdlib.h>
#include <stdio.h>
using namespace std;

class Packet
{
    public:
        unsigned int size_pck;
        char *packet_data;

    Packet(unsigned int size)
    {
        size_pck=size;
        char *packet_data=(char *)malloc(size);
    }

    ~Packet()
    {
        free(packet_data);
    }



};

int main (void)
{
    Packet *created_pck;
    created_pck=new Packet(4);

    return 0;
}

正如您所看到的那样,带有我想要的ID的文本框生成正常,但我无法使用其ID进行选择。

1 个答案:

答案 0 :(得分:0)

我在您的代码中看到的唯一问题是,一旦页面运行,您必须重新调用&#34;每个&#34;来自jquery的函数。当这个&#34;循环&#34;如果没有&#34; foodha&#34;或&#34; priceha&#34;类别的组合元素。你可以把

  $(".foodha").each(function() {
    var IDss = $(this).prop("id");
    foodid.push(IDss);

  });

在睡眠循环或js函数中,你稍后会调用它。就像这样:

setTimeout(function(){
  $(".foodha").each(function() {
    var IDss = $(this).prop("id");
    foodid.push(IDss);

  });
},1000); //for a second delay

function call_after_creating(){
   $(".foodha").each(function() {
      var IDss = $(this).prop("id");
      foodid.push(IDss);
   });
}