Question

我是JS的初学者，所以... 我在寻找答案，但根本没有结果。

我有这个

$(document).ready( function() {
    $("#load_p1").on("click", function() {
        $("#content").load("p1.html");
    });
});

$(document).ready( function() {
    $("#load_p2").on("click", function() {
        $("#content").load("p2.html");
    });
});

$(document).ready( function() {
    $("#load_p3").on("click", function() {
        $("#content").load("p3.html");
    });
});

$(document).ready( function() {
    $("#load_p4").on("click", function() {
        $("#content").load("p4.html");
    });
});

我想知道是否有一种方法可以将所有这些数据保存在一个JSON或另一个文件中，而不是4个.html文件中。

问题2

那是控制视图的正确方法吗？或严重的网站管理员无法接受。

对不起，我的英语不好：|

Answer 1

OP希望将存储在JSON文件中的某些数据异步加载到他的页面中。为此，您需要将load方法替换为html，并将JSON的适当部分作为参数传递。

$("#load_p1").on("click", function() {
    $("#content").html(json[0]);
});

示例JSON结构

json = '[{"p1":"<h1>Test</h1>"},{"p2":"<h1>Test2</h1>"}]'

使用jQuery加载test.json文件：

$.getJSON("test.json", function(json) {
    $("#load_p1").on("click", function() {
        $("#content").html(json[0]);
    });
});

Answer 2

实际上，您的问题不是很清楚。但是，您可以将所有javascript内容放在一个文件中，例如： script.js 并将脚本注入到 HTML 文件中（需要使用此文件）。

       13:27:14.668 [main] ERROR com.intuit.karate - javax.net.ssl.SSLHandshakeException: sun.security.validator.ValidatorException: PKIX path building failed: sun.security.provider.certpath.SunCertPathBuilderException: unable to find valid certification path to requested target, http call failed after 133 milliseconds for URL: https://VRNV02AS04294.int.carlsonwagonlit.com:8443/admin/property/filters/APFilter/true
       13:27:14.668 [main] ERROR com.intuit.karate - http request failed:

Answer 3

jQuery's load()方法允许加载html片段。为此，您可以在要加载的网址后指定一个CSS选择器。当jQuery遇到该选择器时，它将在检索到的html中查找匹配的元素，并将该部分仅加载到该元素中。

例如，如果您在html文件中拥有

<div id="content1">
  content 1
</div>
<div id="content2">
  content 2
</div>
<div id="content3">
  content 3
</div>

二手

jQuery("div").load("all.html #content2")

它只会加载content2 div。

作为旁注，您无需将每个click()调用放入单独的jQuery(document).ready()调用中，您可以将它们放入单个回调中。

jQuery / JSON内容数据加载

3 个答案: