通过 AJAX 将图像加载到 jQuery Supersized 插件中答案

【问题标题】：Loading images via AJAX into jQuery Supersized plugin通过 AJAX 将图像加载到 jQuery Supersized 插件中
【发布时间】：2011-10-25 05:55:21
【问题描述】：

我正在尝试通过 AJAX 将图像动态加载到 jQuery“超大”图像滑块中：http://buildinternet.com/project/supersized/

AJAX 调用可以很好地替换图像，但播放按钮会变得无响应，随后的调用会干扰幻灯片间隔时间（幻灯片更改更快）。

我已经尝试了类似问题here（相同代码）中提供的所有答案（没有运气）。他们认为这可能是一个具有约束力的问题。

所以在html中：

<a href="javascript:brown();">Doeet</a>

Ajax 调用：

function red(){
  $.ajax({
  url: 'ajax.php?action=brown',
  success: function(data){
  $('#script').html(data);
  }
  })
}

Ajax.php：

<?php switch($_GET["action"]){
  case "brown":
  echo "<script type='text/javascript'>
  jQuery(function($){
    $('#supersized').html('');
        $.supersized({          
            slides : [{image : 'image1.jpg'},
                       {image : 'image2.jpg'}]

            });     
    });</script>";
   break; }
?>

【问题讨论】：

标签： jquery jquery-plugins

【解决方案1】：

不要尝试传递整个 javascript 代码来传输。只传输你需要的参数：

function red(){
  $.ajax({
    url: 'ajax.php?action=brown',
    success: function(data){
      if (data != "") {
        $('#supersized').html('');
        $.supersized({          
          slides : [{image : data}],
          ....
        });   
      }
    }
  })
}

php:

<?php 
switch($_GET["action"]){
    case "brown":
    echo "imagename.jpg";
    break; 
}
?>

并且可以使用

【讨论】：

感谢您的回复。我将如何使用多个图像来执行回声参数？此外，通话后 playToggle 按钮不起作用。我明天发个测试链接
测试站点9crawford.com/slider ...当您单击“Doeet”时，AJAX 调用有效，下一个/上一个导航有效，但 playToggle 按钮无效
对不起..我还没有看到这个问题。但我看到你可以解决问题。对于所有 googlers：而不是 <a href="javascript:brown();">Doeet</a> 可以使用 jquery 的点击事件。 api.jquery.com/click 使用 JSON，您可以简单地传输多维数组而没有任何问题。最后：将 javascript 放在您网站的底部。这会提高您网站的性能。