插入一个HTML文件到我的主html文件中使用JavaScript和AJAX

问题描述:

在一个分配我需要一个按钮,单击时,插入从我写的另一个外部html文件中的内容。如果你愿意的话,可以选择一个片段我不想使用iframe,所以我卡住了。我真的不知道如何做到这一点,这是JavaScript代码,我现在:插入一个HTML文件到我的主html文件中使用JavaScript和AJAX

HTML:

<div id = "snippet"></div> 
<button id = "generate">generate</button> 

JS:(忽略第3行,这些都是其他方法)

document.observe('dom:loaded', function() { 
    $('submit').observe('click',alertHSL); 
    $('submit1').observe('click',alertRGB); 
    $('submit2').observe('click',alertHex); 
    $('generate').observe('click',loadSnippet); 
}); 

function loadSnippet() { 
    $("#snippet").load("snippet-b.html"); 
} 

但是当我在Firefox中运行(与萤火调试它),它口口声声说$("#snippet").load("snippet-b.html"); is = null。我如何得到这个工作?

+0

可能重复[如何在html/javascript/css中创建一个按钮,当点击打开网页中的示例网页](http://*.com/questions/8511698/how-to-create-a -button-in-html-javascript-css-that-when-clicked-opens-a-sample-w) – jrummell 2011-12-15 13:37:50

你可以尝试同样的方法用等价get函数:

$.get('snippet-b.html', function(data) { 
    $('#snippet').html(data); 
    alert('Load was performed.'); 
}); 

如果这没有让你更接近你可以加载的jQuery的调试版本,并添加一个断点,看看哪些对象是空的。