最近搜索

遍历 数据的高级写法。 用于table的tr或者 div

浏览:247
管理员 2023-12-18 17:38


遍历 数据的高级写法。  用于table的tr或者 div list 中的item

不用写for循环。还可以跳过某个特定的节点。



function record_select_array_row_data(){
   $("#select_drawing table tbody tr:not([p])").each(function() {
      var drawingid = $(this).attr("drawingid");
      var row = $(this).attr("row");
      if (typeof drawingid === "undefined") {
      } else {
         var chuku_weight = $(this).find('input[type="text"]').eq(0).val();
         var chuku_num = $(this).find('input[type="text"]').eq(1).val();
         var ycl_id = $(this).attr("ycl_id");
         //遍历select_array 找到row对应 的数据,设置数据。 drawingid chuku_w chuku_num ycl_id
         // 遍历 select_array 找到 row 对应的数据,设置数据
         var rowData = select_array.find(function(item) {
            return item.row == row;
         });
         if (rowData) {
            rowData.drawingid = drawingid;
            rowData.chuku_weight = chuku_weight;
            rowData.chuku_num = chuku_num;
            rowData.ycl_id = ycl_id;
         }
      }
   });
}



//定时记录用户输入的数据。
function record_select_array_row_data(){
   $("#ruku_list table tbody tr").each(function() {
      var tr_row = $(this).attr("row");

      var biaozhun = $(this).find('input[type="text"]#biaozhun').eq(0).val();   
      var guige =$(this).find('input[type="text"]#guige').eq(0).val();

      var weight = $(this).find('input[type="text"]#weight').eq(0).val();
      var number1 =$(this).find('input[type="text"]#number1').eq(0).val();

      var danjia = $(this).find('input[type="text"]#danjia').eq(0).val();
      var zongjia =$(this).find('input[type="text"]#zongjia').eq(0).val();

      var material_id = $(this).find('select#material_id').eq(0).val();
      var supplier_id =$(this).find('select#supplier_id').eq(0).val();

   });
}

这样的写法,可能input有缓存值。因为有#bianhao

$(this).find('input[type="text"]').eq(0).val();  不如用这样的写法。这样就没有缓存 值。



$('input[type="text"]').each(function() {
    console.log("init_num_each");
    var $this = $(this);
    var tr = $this.closest('tr');
    var ycl_id = tr.attr('ycl_id');
    //根据ycl_id 查询数据有没有记录加载
    $.post('/admin/duan/da/find/by/ycl_id',{ycl_id:ycl_id},function(result){
        if(result.success){
            $this.val(result.duanDaKu.num);
        }
    },'json');
});






这是遍历  tr所有的tr  p的属性是1
<tr p="1" ycl_id="10" draw_id="15872"><td colspan="8" style=" text-align: right;">

//初始化input的值,之前写的值。
function  init_num(){
    console.log("init_num");
    $('tr[p="1"]').each(function() {
        var $tr = $(this); // 保存$(this)的引用
        var ycl_id = $tr.attr('ycl_id');
        console.log("原材料出库id"+ycl_id);
        // 进行赋值操作
        // 例如,将获取的值赋给其他 input 元素
        //根据ycl_id 查询数据有没有记录加载
        $.post('/admin/duan/da/find/by/ycl_id',{ycl_id:ycl_id},function(result){
            if(result.success){
                $tr.find('input#num').val(result.duanDaKu.num);
                $tr.find('input#weight').val(2);
                $tr.find('input#danjia').val(3);
                $tr.find('input#zongjia').val(4);
            }
        },'json');
    });
}



//初始化删除按钮操作
function init_del_click() {
   var delList = $("#data_list ").find("button#del");
   console.log("delList长度::" + delList.size());
   $(delList).click(function () {
      console.log($(this));
      if(save_flag){
         return;
      }
      //执行删除本行操作
      var tr_row = $(this).closest("tr").attr("row");
      $(this).closest("tr").remove(); // 删除当前行
      tr_row = parseInt(tr_row);
      select_array = select_array.filter(function(item) {
         return item.row !== tr_row;
      });
   });
}



快速 定位要找到元素

$("#data_list table tbody tr:eq(" + row_index + ") td:eq(0)").html(`下标是:${row_index},设备id:${data.shebei_id} ,设备名称:${data.shebei_name}`);




遍历 还可以添加下标 以及dom对象  以下添加点击事件。


function  init_click_event(){
    $(".indicator span").each(function(index) {
        $(this).off("click").on("click",function(){
            console.log(index);//输出下标
            moveTo(index);
        })
    });
}


$(".indicator span").each(function(index, element) {
    // index: 当前元素的索引
    // element: 当前遍历到的 DOM 元素(非 jQuery 对象)

    // 如果你需要使用 jQuery 方法,可以这样做:
    var $element = $(element);

    // 现在你可以使用 $element 来调用 jQuery 方法了
    $element.off("click").on("click", function() {
        console.log(index); // 输出当前 span 的下标
    });
});





联系站长

站长微信:xiaomao0055

站长QQ:14496453