javascript - 使用 jquery 加载基于 radio 值加载 html 内容

Question

我正在使用 jquery 加载函数编写脚本，但遇到了菜鸟问题......

我有 2 个 html 文件，

1. teSTLoad.html Pastebin file

2. html 文件的名称根据 teSTLoad.html 中给出的输入值而变化，但出于演示目的，我创建了 test.html 并在输入字段中输入“test”进行测试。

演示 test.html - Test.html

现在的问题是，当用户单击 teSTLoad.html 文件中的单选按钮时，应该只从 test.html 检索基于 id 的 div 的内容，但我获取了所有 div 的内容。

test.html 中 div 的 id 与 teSTLoad.html 中各个单选按钮的值相同

总结

用户在 teSTLoad.html(演示目的:测试)中的输入字段中输入文本

任选其一

test1 radio => 显示 test.html 的 #1

test2 radio => 显示 test.html 的 #2

test3 radio => 显示 test.html 的 #3

问题:我一次性获取了所有内容，而不是所需的内容。

希望在这里得到一些帮助..

我

更新:

没关系.. 我犯了一个小错误。现在修好了。问题是我错过了加载函数上的连接。我将脚本行更改为..

    $('input[type="radio"]').click(function() {
        var test = $(this).val();        
        var url = $('#page').val();
        url = url +".html #";
        $('#getcontent').load(url + test);

Answer 1

我想我已经为您想出了一个简单的解决方案。

 $('#radio1').click(function() {
       $('#res').html("");
       $('#res').load("index.html #target"); //where Target stands for the DIV inside the html file
    });


    $('#radio2').click(function() {
       $('#res').html("");
       $('#res').load("index.html #target");
    });

如果对您有帮助，请告诉我，祝您编写脚本愉快!

更新

如果您想使用 var 而不是指定正确的 div ID 或您可以使用的 html 文件

 $('#res').load(htmlVar".html #"+divVar);

但由于您使用的是 ID，因此您必须在 div 的 ID 之前使用 #。

欲了解更多信息，请访问:http://api.jquery.com/load/ (加载页面元素)。