如何显示使用jQuery load()将多个项目ajax转换为多个元素?

时间:2020-12-18 16:31:44

I need to load certain items from a big page into a page's different elements. The code I wrote is working but items load one by one and after a lot of pause. I am thinking I might doing it wrong way as I am not a complete developer but just a designer.

我需要将大页面中的某些项目加载到页面的不同元素中。我写的代码正在工作但是项目一个接一个地加载并经过很多停顿。我想我可能做错了,因为我不是一个完整的开发人员而只是一个设计师。

My code look likes:

我的代码看起来像:

$("#lot-rental").load("/est.html #est-rental");
$("#lot-deposit").load("/est.html #est-deposit");
$("#lot-date").load("/est.html #est-date");
$("#lot-build").load("/est.html #est-build");

Please help me its kinda urgent for me. Your help will be appreciated. Thanks

请帮帮我吧。我们将不胜感激。谢谢

3 个解决方案

#1


5  

Use $.get() to load the data and then set the content of the various elements manually.

使用$ .get()加载数据,然后手动设置各种元素的内容。

$.get('/est.html', function(data) {
    $.each(['rental', 'deposit', 'data', 'build'], function(i, key) {
        $('#lot-' + key).html($(data).find('#est-' + key));
    });
}, 'html');

#2


0  

Why not use $.get parse the response (find the elements) and load them to the main page:

为什么不使用$ .get解析响应(找到元素)并将它们加载到主页面:

$.get('/est.html',function(html){
    //wrap in jQuery so we can use it as context
    html = $(html);

    //find the item in html, and append to the container in the current page
    $('#est-rental',html).appendTo('#lot-rental');
    //     ^          ^                  ^-- target
    //     |          '-- context
    //     '-- the element to find in HTML
});

#3


0  

Try this

尝试这个

$("#lot-rental").load("est.html#est-rental");
$("#lot-deposit").load("est.html#est-deposit");
$("#lot-date").load("est.html#est-date");
$("#lot-build").load("est.html#est-build");

#1


5  

Use $.get() to load the data and then set the content of the various elements manually.

使用$ .get()加载数据,然后手动设置各种元素的内容。

$.get('/est.html', function(data) {
    $.each(['rental', 'deposit', 'data', 'build'], function(i, key) {
        $('#lot-' + key).html($(data).find('#est-' + key));
    });
}, 'html');

#2


0  

Why not use $.get parse the response (find the elements) and load them to the main page:

为什么不使用$ .get解析响应(找到元素)并将它们加载到主页面:

$.get('/est.html',function(html){
    //wrap in jQuery so we can use it as context
    html = $(html);

    //find the item in html, and append to the container in the current page
    $('#est-rental',html).appendTo('#lot-rental');
    //     ^          ^                  ^-- target
    //     |          '-- context
    //     '-- the element to find in HTML
});

#3


0  

Try this

尝试这个

$("#lot-rental").load("est.html#est-rental");
$("#lot-deposit").load("est.html#est-deposit");
$("#lot-date").load("est.html#est-date");
$("#lot-build").load("est.html#est-build");