使用 JavaScript,如何获取 AJAX 请求并仅 创建一次 div?正如您在此示例中看到的,每次单击按钮时都会收到 AJAX 请求,并且还会创建 div:http://jsfiddle.net/2uvms99o/
HTML:
<button onclick="test();">Press Me</button>
JavaScript:
function test() {
$.ajax({
url: 'https://storage.googleapis.com/maps-devrel/google.json',
type: 'GET',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
async: false,
success: function (data) {
var div = document.createElement('div');
div.innerHTML = 'This is a div!';
document.body.appendChild(div);
}
});
}
也许有比 onclick
更好的方法?
最佳答案
jQuery 提供 $.fn.one
完全用于此目的的方法:它在第一次触发后取消绑定(bind)事件:
$('button').one('click', function() {
$.ajax({
url: 'https://storage.googleapis.com/maps-devrel/google.json',
type: 'GET',
contentType: 'application/json; charset=utf-8',
dataType: 'json',
async: false,
success: function (data) {
var div = document.createElement('div');
div.innerHTML = 'This is a div!';
document.body.appendChild(div);
}
});
});
这也是首选方法,因为您不使用突兀的内联事件处理程序属性,从而保持 HTML 干净。只需确保使用更具体的 CSS 选择器(通过 id、类、父级等)绑定(bind)此事件,您不希望页面上的所有按钮在点击时创建 div。
关于javascript - 获取 AJAX 请求并仅创建一次 div,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32015394/