个人中心
gpt4 book ai didi

javascript - 使用 jQuery 将参数传递给我加载的 div

转载 作者：行者123 更新时间：2023-11-28 03:03:48 25 4
gpt4 key购买 nike

我有几个共享同一个导航栏的 html 页面。因此，我编写了一个 html 文件 - topnav.html，并使用以下 jQuery 代码将其加载到每个页面中。

javascript

<script type="text/javascript">
$(function() {        
    $('#topnav').load('topnav.html');
});
</script>

html

<body>
<div id="topnav"></div>
...

现在，我发现每个页面都需要有不同的属性(比如不同的标题)。如何将标题参数传递给 tapnav.html 页面？

最佳答案

第一个解决方案是用 PHP 编写的，因为我更喜欢它。如果您想在 JS 中执行此操作，请参阅下面的编辑。

如果您使用的是 PHP，您可以包含一个文件(带有函数)，并将该函数作为参数传递，如下所示:

index.php

<?php
    include "topnav.php";
    top("title");
?>

topnav.php

<?php
    function top($title) {
?>
    <div id="topNav">
        <!-- Other code you need here -->
        <span id="title"><?= $title ?></span> <!-- put in inputted title -->
    </div>
<?php
    }
?>

我不使用 JS/jQuery 为我的网站加载资源(部分页面)。 PHP include()方便多了，我一直在用!

编辑

现在我想到了，您可能可以在 JavaScript 中做非常相似的事情，尽管它稍微麻烦一些。在 JS 中放置一个函数，然后从页面调用它。

例如:

index.html

<script type="text/javascript">
    $(function() {        
        $('#topnav').load('topnav.html');
        $("body").append(top("title"));
    });
</script>

topnav.html

<script>
    // basically return (or print out) string of resource
    function top(title) {
        return "<div id='topNav'>" +
                   "<!-- Other code you need here -->" +
                   "<span id='title'>" + title + "</span>" +
                "</div>";
    }
</script>

编辑 2:更详细的解释(应要求)

JS 示例所做的是像您在示例中所做的那样加载资源文件。但是，它不是像您这样的纯 HTML 文件，而是一个 JS 文件。加载后，您现在可以使用 JS 脚本。基本上，添加的脚本允许您使用大部分预定义的字符串，但您可以添加一些变量(例如，"<span id='title'>" + title + "</span>" 允许您将 title 放入其中)。

关于javascript - 使用 jQuery 将参数传递给我加载的 div，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33466454/

25 4 0
文章推荐： javascript - 如何在单击按钮或链接时使用 javascript 或 jquery 动态制作或创建 Binder ？
文章推荐： c++ - 未在此范围内声明的 Opencv 变量
文章推荐： html - CSS中段落和标题的对齐
文章推荐： css - SVG 中文本的背景色
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com