javascript - 尝试将带有脚本的 html 加载到另一个页面

标签 javascript jquery html variables load

谢谢你的时间这是我在这里的第一篇文章:)

所以我有一个运行良好的脚本,这里是我的 page1.html 简化版:

<html>
<head>
    <script type="text/javascript" src="js/jquery-1.6.4.min.js"></script>
    <script>
    var lang = "en";
    $(function(){ 
        $("#morelink").load("page2.html");
    });
    </script>
</head>
<body>
    <div id="morelink"></div>
</body>
</html>

这里我的 page2.html 简化了,是添加到我的页面 1 中:

<div>       
    <a href="model_1_'+lang+'.html">
        <img src="image1.png" />
    </a>
    <a href="model_2_'+lang+'.html">
        <img src="image2.png" />
    </a>
    <a href="model_3_'+lang+'.html">
        <img src="image3.png" />
    </a>
</div>

加载工作正常,但这不起作用,因为当我点击一个链接时应该给我一个链接:

 model_3_en.html

但他给我:

 model_3_'+lang+'.html

为什么 var lang = "en" 不起作用?

最佳答案

您必须在新页面内容加载过程之后动态设置 anchor 的 href 属性。

尝试像下面这样更改您的 page2.html

<div>       
    <a data-link="model_1_">
        <img src="image1.png" />
    </a>
    <a data-link="model_2_">
        <img src="image2.png" />
    </a>
    <a data-link="model_3_">
        <img src="image3.png" />
    </a>
</div>

你的脚本如下,

var lang = "en";
$(function(){ 
  $("#morelink").load("page2.html",function(){
       $("#morelink a[data-link]").attr("href", function(){
          return $(this).data("link") + lang + ".html";
       });
  });
});

关于javascript - 尝试将带有脚本的 html 加载到另一个页面,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/35667452/

相关文章:

javascript - 如何在上传到服务器之前用 Javascript 解析 .zip 文件

javascript - JQuery 不工作,可能是源错误?

javascript - 如何跳过某些 div 在上下文中进行搜索?

javascript - 添加新元素时使子元素调整大小

javascript - 具有延迟渲染的 Angular 数据表

javascript - 将 CSS3 过渡添加到 jQuery Animate 脚本

javascript - jQuery 检测元素是否已链接

Javascript - 如何保存刷新后添加到 <ul> 的 <li> 元素?

javascript - 编写 v1 嵌套 Web 组件

javascript - 页面加载时触发 jQuery 事件