Question

如何使用jquery从此HTML页面获取所有数据ID 和金额。获得这些价值后...我想把它推到阵列然后通过ajax发布。这是一个laravel项目。我这里没有使用表单。

This is that image, from where I want to get value

//Here is the Html code
       <?php $i=1 ?>
        @foreach($expanse as $expanse)
           <tr>
                <td class="text-center">{{$i}}</td>
                <td>
                  <h4 class="expVal" data-id="{{$expanse->id}}">{{$expanse->name}}</h4>
                </td>
                <td class="text-right">
                     <a href="#" class="expanseRent" data-type="text" data-placement="right" id="rent[]" data-title="Enter rent">{{$expanse->rent}}</a>
                 </td>

          </tr>
         <?php $i++ ?>
        @endforeach

Answer 1

您可以获得所有数据ID和数量

var ids = [],amounts = [];
$(".expVal").each(function(){
    ids.push($(this).data('id'));
    var b = $(this).parent().next().find('a.expanseRent').text();
    amounts.push(b);
})

另一种方法是

var datas=[];
    $(".expVal").each(function(){

        var a = $(this).data('id');
        var b = $(this).parent().next().find('a.expanseRent').text();

        datas.push(a+":"+b);
    })

Answer 2

您可以遍历jquery中的每个.expVal元素，然后使用jquery获取data-id属性。

之后，您可以将此值推送到某个数组中。

var data_id_array=[];

$( ".expVal" ).each(function( index ) {
  data_id_array.push($(this).attr('data-id'));
});

如需租借，请在data-rent属性中添加租金。

<a href="#" class="expanseRent" data-rent="{{$expanse->rent}}" data-type="text" data-placement="right" id="rent[]" data-title="Enter rent">{{$expanse->rent}}</a>

然后，像这样做同样的过程来获得租金。

    var rent_array=[];

    $( ".expanseRent" ).each(function( index ) {
      rent_array.push($(this).attr('data-rent'));
    });

因此，对于您的输出，正如您在评论中提到的那样，循环遍历data_id_array数组并创建您想要的json项目，并将其推入finalArray这样的内容。

var finalArray = [];
var i;
for (i = 0; i < data_id_array.length; ++i) {
    var itemArr={};
    itemArr[data_id_array[i]] =  rent_array[i];
    finalArray.push(itemArr);
}

最后，finalArray将包含[{1:1200},{2:3000}]之类的所有项目。

Answer 3

您可以使用jquery的data()来获取数据 - *

On Error Resume Next
Dim Row As Long
Dim Clm As Long
lastrow1 = Sheets("Sheet2").Cells(Rows.Count, 1).End(xlUp).row
lastRow = ActiveSheet.Cells(Rows.Count, 1).End(xlUp).row


        Table1 = Sheets("Sheet1").Range("X2:X" & lastRow)
        Source1 = Sheets("Sheet2").Range("E3:J" & lastrow1)
        Row = Sheets("Sheet1").Range("F2").row
        Clm = Sheets("Sheet1").Range("F2").Column


For Each cl In Table1
Sheets("Sheet1").Cells(Row, Clm) = Application.WorksheetFunction.VLookup(cl, Source1, 5, False)
Row = Row + 1
Next cl

Set range1 = Sheets("Sheet1").Range("Q2:Q" & lastRow)
Set range2 = Sheets("Sheet1").Range("E2:E" & lastRow)
Set range3 = Sheets("Sheet1").Range("F2:F" & lastRow)


For Each cl In range1

If range3.Value <> "" And range2.Value <> "" Then
range1.Value = range3.Value


    ElseIf range3.Value = "" And range2.Value <> "" Then
    range1.Value = range2.Value

        Else: range3.Value = "" And range2.Value = ""
        range1.Value = Application.WorksheetFunction.VLookup(cl, Source1, 6, False)

    End If
    Next cl

*假设每个$(".expVal").data("id")都有.expVal个课程。

<td>

然后将其传递到var attrs = []; var vals = []; $(".expVal").each(function(){ attrs.push($(this).attributes.nodeName); vals.push($(this).data("id")+":"+$(this).data("rent")); }) ajax这样的电话

POST

Answer 4

您可以执行类似的查询，它将返回按DOM中元素出现顺序索引的对象。 $("[data-id]")

此外，我还会将金额作为数据属性包含在同一元素中，例如 <h4 class="expVal" data-id="{{$expanse->id}}" data-amount="{{$expanse->rent}}">{{$expanse->name}}</h4> 现在通过数据集属性，您将能够访问， $("[data-id]")[0].dataset.amount 这是有关data属性的文档 https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes

如何使用jQuery从html页面获取所有数据id和数量，并通过ajax与数据发布

4 个答案: