我正在try 构建一个图像库,按下相关按钮将显示(并写入)到隐藏的div中.使用jquery,我可以让它显示/隐藏div,甚至加载指定的图像.但当我试图把所有东西都放在一个外部文件中(以尽量减少代码重复)时,我什么也得不到.

主html文件:

    <!DOCTYPE html>
    <html>
    <head>
<link rel="stylesheet" href="css/full.css">
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js"></script>
    </head>
    <body>
    <div id="img-container" style="display: none;">

    </div>


    <button id="view-more">Show</button>
    <script type="text/javascript">
    var imgWrite = $('<img src="img/photos/image0000-0.png" />');

    $("#view-more").click(function(){
            $("#img-container").css('display', 'flex');
             $('#img-container').load("galleries/gallery01.txt"
        
    });
       
    $("#close").click(function(){   
     $("#img-container").css('display', 'none');
    });
    </script>
    </body>
    </html>

编辑帖子:

<button id="close">Close</button>
<img src="img/photos/image0000-0.png" />
<div id="info">
<h4>Title</h4>
<h5>Artist</h5>
<h5>Medium</h5>
<h6>Notes</h6>
</div>

编辑:我修复了缺少的关闭参数、按钮和加载的背景样式,但仍然没有图像或标题.

推荐答案

你能用Ajax方法再试一次吗?

$("#view-more").click(function(){
    $("#img-container").css('display', 'flex');
    
    $.ajax({
        url : "galleries/gallery01.txt",
        dataType: "text",
        success : function (data) {
            $('#img-container').html(data);
        }
    }); 
});

Jquery相关问答推荐

如何在for循环期间上传文件

使用带有 Ajax GET URL 的数组在每次单击按钮时一次单步执行一个

Jquery $(this) 子 Select 器

jQuery:获取数据属性

如何在 JavaScript 或 jQuery 中过滤 JSON 数据?

jQuery 上传进度和 AJAX 文件上传

递归循环遍历对象(树)

使用 JavaScript/jQuery 重定向到 ASP.NET MVC 中的另一个页面

在 for 循环中分配点击处理程序

将变量传递给jQuery AJAX成功回调中的函数

删除所有子元素的 CLASS

如何在 JQuery UI 自动完成中使用 source:function()... 和 AJAX

在单击事件上判断 Ctrl / Shift / Alt 键

使html文本输入字段随着我输入而增长?

使用 jQuery Select 焦点文本在 Safari 和 Chrome 中不起作用

覆盖 twitter bootstrap Textbox Glow and Shadows

触发下拉更改事件

检测 jQuery UI 对话框是否打开

设置 JQuery event.preventDefault() 时绕过 window.open 上的弹出窗口阻止程序

如何禁用由子元素触发的 mouseout 事件?