用在所述div中加载的外部文件中的外部文件替换div内容

Question

我有一个文件，比如'file1.html'，通过jQuery加载到div中$('#info').load('info/file1.html');我想从file1中更改#info的内容，所以file1.html看起来像这样：

<a href="#" onclick="loadFile(this.value);" value="file2">File2</a>

，其中

function loadFile(f) {
    $('#info').load('info/'+f+'.html');
}

但是，点击后我只在div中得到一个空白页面。我还尝试删除'info/'如果文件夹设置打破了它，但没有。怎么了？

Answer 1

问题是锚标记dom对象（HTMLAnchorElement）没有设置“value”属性。要获取dom对象所代表的锚标记的value属性，您可以执行$(this).attr('value')（而不是this.value，这将是未定义的。）

但实际上，您应该使用id / class和jquery附加事件，而不是使用onclick属性。您应该调用锚点属性data-value，而不是value，以符合自定义属性的HTML5规范。所以更好的方法是：

HTML：

<a href="#" id="file-loader" data-value="file2">File2</a>

使用Javascript：

$('#file-loader').click(function(ev) {
    $('#info').load('info/' + $(this).attr('data-value') + '.html');
    ev.preventDefault();
});

Answer 2

使用：

  <a href="#" onclick="loadFile('file2');">File2</a>