2

如何使用jQuery多次加载 test.html 。

function loadScreen()
{
  $('#result').load('test.html');
}

main.html

<div id='result'></div>
<input type="button" value="click me" onclick="loadScreen()">

测试.html

<body>
<p>
testing
</p>
</body>

现在的情况

当我点击按钮点击我。它将在 main.html 测试中加载一次

我想做的事

当我单击按钮两次时，我该怎么做？

testing
testing

并具有不同的 div id

第一次按钮单击显示测试 <div id="result1">testing</div> 第二次按钮单击显示测试 <div id="result2">testing</div>

它将在 id 处附加增量 1。

4

2 回答 2

5

load()将替换目标元素的内容，这就是它无法按您想要的方式工作的原因。

试试这个：

function loadScreen() {
    var divId = $("#result > div").length + 1;
    $('#result').append("<div></div>").attr("id", "result" + divId).load('test.html');
}
于 2012-05-21T09:07:03.000 回答
0

然后是你应该使用的时候$.get()了，然后通过创建一个div $()，使用添加内容.html()和.appendTo()结果div。

var result = $('#result'),            //cache result box
    i = 0;

function loadScreen(){
    $.get('test.html',function(data){ //initiate get
        $('<div>',{                   //create div for return data
            id : 'result'+(++i)       //add attributes
        })
        .html(data)                   //add data
        .appendTo(result);            //append to result
    });
}
于 2012-05-21T09:06:35.280 回答