Php Galleria可以与ajax数据一起使用吗？_Php_Jquery_Ajax_Galleria

Php Galleria可以与ajax数据一起使用吗？

php jquery ajax

Php Galleria可以与ajax数据一起使用吗？,php,jquery,ajax,galleria,Php,Jquery,Ajax,Galleria,我真的需要一些帮助！我有一个页面，上面有1、2或3组图像。我点击一个图像，这个类被发送到一些jqueryajax的东西，以获取id（mysql），然后这个id被发送到一个php文件，以构建html，以便图像显示在我页面的div中。这一点工作正常，但我正试图使用galleria插件来显示已发送的图像，但它只是假装galleria不在那里！如果我在潜水中硬编码一些图像。galleria的工作应该是这样的这是我的project.js文件 // whenever a link with catego

我真的需要一些帮助！我有一个页面，上面有1、2或3组图像。我点击一个图像，这个类被发送到一些jqueryajax的东西，以获取id（mysql），然后这个id被发送到一个php文件，以构建html，以便图像显示在我页面的div中。这一点工作正常，但我正试图使用galleria插件来显示已发送的图像，但它只是假装galleria不在那里！如果我在潜水中硬编码一些图像。galleria的工作应该是这样的

这是我的project.js文件

// whenever a link with category class is clicked
$('a.project').click(function(e) {
// first stop the link to go anywhere
e.preventDefault();
// you can get the text of the link by converting the clicked object to string
// you something like 'http://mysite/categories/1'
// there might be other methods to read the link value
var linkText = new String(this);
// the value after the last / is the category ID
var projectvalue = linkText.substring(linkText.lastIndexOf('/') + 1);
// send the category ID to the showprojects.php script using jquery ajax post method
// send along a category ID
// on success insert the returned text into the shownews div
$.post('../inc/showprojects.php', {project: projectvalue}, function(data) {
$('#shownews').html(data);
});


});

这是我的showproducts.php文件

<?php
include 'connect.php';
// if no project was sent, display some error message
if(!isset($_POST['project'])) {
die('No project has been chosen');
}
// cast the project to integer (just a little bit of basic security)
$project = (int) $_POST['project'];
// this will be the string that you will return into the shownews div
$returnHtml = '';
$q = "SELECT * FROM projects WHERE id='$project'";
if($r = mysql_query($q)) {
// construct the html to return
while($row = mysql_fetch_array($r)) {
    $returnHtml .= "<img src='{$row['filename']}' />";
    $returnHtml .= "<img src='{$row['filename1']}' />";
    $returnHtml .= "<img src='{$row['filename2']}' />";
}
}
// display the html (you actually return it this way)
echo $returnHtml;
?>

有人能帮我吗

谢谢

试试这个

    // whenever a link with category class is clicked
    $('a.project').click(function(e) {
    // first stop the link to go anywhere
    e.preventDefault();
    // you can get the text of the link by converting the clicked object to string
    // you something like 'http://mysite/categories/1'
    // there might be other methods to read the link value
    var linkText = new String(this);
    // the value after the last / is the category ID
    var projectvalue = linkText.substring(linkText.lastIndexOf('/') + 1);
    // send the category ID to the showprojects.php script using jquery ajax post method
    // send along a category ID
    // on success insert the returned text into the shownews div
    $.ajax({url:'../inc/showprojects.php',
            type:'POST' ,
            method,async:false ,
            data:{project: projectvalue}, 
            success:function(data) {
                 $('#shownews').html(data);
        }});
Galleria.run('#shownews');

});

试试这个

    // whenever a link with category class is clicked
    $('a.project').click(function(e) {
    // first stop the link to go anywhere
    e.preventDefault();
    // you can get the text of the link by converting the clicked object to string
    // you something like 'http://mysite/categories/1'
    // there might be other methods to read the link value
    var linkText = new String(this);
    // the value after the last / is the category ID
    var projectvalue = linkText.substring(linkText.lastIndexOf('/') + 1);
    // send the category ID to the showprojects.php script using jquery ajax post method
    // send along a category ID
    // on success insert the returned text into the shownews div
    $.ajax({url:'../inc/showprojects.php',
            type:'POST' ,
            method,async:false ,
            data:{project: projectvalue}, 
            success:function(data) {
                 $('#shownews').html(data);
        }});
Galleria.run('#shownews');

});

我认为，您需要调用Galleria.run，在接收到来自php的数据后运行

编辑：丑陋的方式-销毁库，如果在将新图像插入div之前已经运行

if($('#shownews').data('galleria')){$('#shownews').data('galleria').destroy()} //destroy, if allready running
$.post('../inc/showprojects.php', {project: projectvalue}, function(data) {
    $('#shownews').html(data);
    Galleria.run('#shownews');
});

并删除

$（'#shownews'）.galleria（）
编辑2：使用Galleria的.load api加载新数据
// whenever a link with category class is clicked
$('a.project').click(function(e) {
    // first stop the link to go anywhere
    e.preventDefault();
    // you can get the text of the link by converting the clicked object to string
    // you something like 'http://mysite/categories/1'
    // there might be other methods to read the link value
    var linkText = new String(this);
    // the value after the last / is the category ID
    var projectvalue = linkText.substring(linkText.lastIndexOf('/') + 1);
    // send the category ID to the showprojects.php script using jquery ajax post method
    // send along a category ID
    // on success insert the returned text into the shownews div
    $.post('../inc/showprojects.php', {project: projectvalue}, 
        function(data) {
            $('#shownews').data('galleria').load(data);
        },"json"
    );
});

PHP
我认为，您需要调用Galleria.run，在接收到来自php的数据后运行
编辑：丑陋的方式-销毁库，如果在将新图像插入div之前已经运行
if($('#shownews').data('galleria')){$('#shownews').data('galleria').destroy()} //destroy, if allready running
$.post('../inc/showprojects.php', {project: projectvalue}, function(data) {
    $('#shownews').html(data);
    Galleria.run('#shownews');
});

并删除$（'#shownews'）.galleria（）
编辑2：使用Galleria的.load api加载新数据
// whenever a link with category class is clicked
$('a.project').click(function(e) {
    // first stop the link to go anywhere
    e.preventDefault();
    // you can get the text of the link by converting the clicked object to string
    // you something like 'http://mysite/categories/1'
    // there might be other methods to read the link value
    var linkText = new String(this);
    // the value after the last / is the category ID
    var projectvalue = linkText.substring(linkText.lastIndexOf('/') + 1);
    // send the category ID to the showprojects.php script using jquery ajax post method
    // send along a category ID
    // on success insert the returned text into the shownews div
    $.post('../inc/showprojects.php', {project: projectvalue}, 
        function(data) {
            $('#shownews').data('galleria').load(data);
        },"json"
    );
});

PHP
在ajax请求成功完成后尝试加载galleria。通过执行此操作，jquery将等待ShowNews
渲染完成，然后运行galleria
$.ajax(
    {
        type: "POST",
        url:'../inc/showprojects.php',
        data:{project: projectvalue},
        success: function(data) 
        {
            $('#shownews').html(data);
        },
        complete: function()
        {
           Galleria.loadTheme('../galleria/themes/classic/galleria.classic.min.js');

           $('#shownews').galleria();
        }
    });

每当我从远程源收集图像数据时，我都使用这种方法。希望这有帮助
 在ajax请求成功完成后尝试加载galleria。通过执行此操作，jquery将等待ShowNews
渲染完成，然后运行galleria
$.ajax(
    {
        type: "POST",
        url:'../inc/showprojects.php',
        data:{project: projectvalue},
        success: function(data) 
        {
            $('#shownews').html(data);
        },
        complete: function()
        {
           Galleria.loadTheme('../galleria/themes/classic/galleria.classic.min.js');

           $('#shownews').galleria();
        }
    });

每当我从远程源收集图像数据时，我都使用这种方法。希望这有帮助
 我在网上尝试了这个答案和其他答案，但没有任何效果。然后我把galleria-1.3.5.min.js移到了父页面，它成功了。多么简单的解决方案
 我在网上尝试了这个答案和其他答案，但没有任何效果。然后我把galleria-1.3.5.min.js移到了父页面，它成功了。多么简单的解决方案
 你得到了什么错误？我没有得到任何错误，图像被添加到div中，但是div上没有galleria！就像我说的，如果我把图片硬编码到div中，那么galleria就会显示出来并正常工作！你得到了什么错误？我没有得到任何错误，图像被添加到div中，但是div上没有galleria！就像我说的，如果我把图片硬编码到div中，那么galleria就会显示出来并正常工作！如果（！isset（$_POST['project']）{die（'No project's selected'）；}请在$.ajax请求中添加类型：“POST”键值对。当我按return时，如何在此处获得返回，它将发布我的评论！e、 预防默认值（）；现在已停止工作，它试图转到我不存在的链接.Galleria.run（“#shownews”）；将此代码添加为codeif（！isset（$\u POST['project']）{die（'No project's Selected'）；}中的mentiooned。请在$.ajax请求中添加类型：“POST”键值对。当我按return时，如何在此处获得返回，它将发布我的评论！e、 预防默认值（）；现在已停止工作，它试图转到我不存在的链接.Galleria.run（“#shownews”）；将此代码添加为代码中的mentiooned谢谢您的回复，但这不起作用。它也在做同样的事情，把图像放在div中，但不加载galleria！完成。我试图提高投票率，但不能，因为我不到15岁，不管这意味着什么…………嗨，我又注意到了一些事情。第一次点击链接图片时，galleria可以加载，但如果点击其他图片，galleria就会消失！你知道为什么吗？但是如果我用f5刷新页面，就可以了！非常感谢。另一种方法可能是加载接收到的数据。类似于Galleria.get（0）.load（数据）但它要求数据作为对象数组返回[{image:'image1.jpg'}，{image:'image2.jpg'}，{image:'image3.jpg'}]
谢谢您的回复，但这不起作用。它也在做同样的事情，把图像放在div中，但不加载galleria！完成。我试图提高投票率，但不能，因为我不到15岁，不管这意味着什么…………嗨，我又注意到了一些事情。第一次点击链接图片时，galleria可以加载，但如果点击其他图片，galleria就会消失！你知道为什么吗？但是如果我用f5刷新页面，就可以了！非常感谢。另一种方法可能是加载接收到的数据。类似于Galleria.get（0）.load（数据）但它要求数据作为对象数组返回[{image:'image1.jpg'}，{image:'image2.jpg'}，{image:'image3.jpg'}]
，这给了我这个“致命错误：无法从CSS中提取舞台高度”。跟踪高度：0px。'而且，当我单击一个图像组，然后单击另一个图像组时，它会再次显示第一个图像组！你确定你已经在页面的头部导入了Galleria-{version}.min.js和Galleria CSS吗？是的，min.js和CSS文件都导入了！这给了我一个致命的错误：无法从CSS中提取舞台高度。跟踪高度：0px。'而且，当我单击一个图像组，然后单击另一个图像组时，它会再次显示第一个图像组！你确定你已经在页面的头部导入了Galleria-{version}.min.js和Galleria CSS吗？是的，min.js和CSS文件都导入了！