将jquery格式应用于ajax输出

时间:2014-02-13 00:12:13

标签: javascript jquery ajax

我正在使用jquery轮播在动态填充的列表中显示一些图像。当页面首次打开时,它看起来很棒,但是一旦ajax替换包含轮播内容的div的内容,所有格式化等都将丢失。

我理解这是因为ajax内容是新创建的,并且在轮播脚本完成工作时不存在但我不知道如何将格式应用于新内容?

这是显示新创建的数据的ajax调用

$(function(){
    var audit_id = $('#auditID').val();
    var btnUpload=$('#upload');
    var status=$('#status');
    new AjaxUpload(btnUpload, {
        action: '../ajax/upload_standard_ajax.php?audit_id='+audit_id,
        name: 'uploadfile',
        onSubmit: function(file, ext){
             if (! (ext && /^(jpg|JPG)$/.test(ext))){ 
                status.text('Only jpg files are allowed');
                return false;
            }
                status.text('Uploading...');
        },
            onComplete: function(response){
                status.text('');
                //if(response==="success"){
                  $.ajax({
                      url: 'ajax/create_audit_standard_carosel.php',
                      type:'POST',
                      data: 'audit_id='+audit_id,
                     success: function(response){
                    $('#selected_standards').html(response);
                    }, // End of success function of ajax form
                error:function (xhr, ajaxOptions, thrownError){
               alert(thrownError);
            }
         }); // End of ajax call
        }
    }); 
});

用于触发ajax调用的html

<a href="#" class="upload_stuff ipad_hide">
   <div id="upload">
     <span class="upload_btn">&nbsp;</span>
   </div>
</a>
<span id="status" ></span>

ajax回复

$output .='<ul id="standards_list" class="touchcarousel-container">';
    while($row = mysqli_fetch_assoc($result)){          
      $output .='<li class="touchcarousel-item">';
      $output .='<img src="'.$row['imageLocation'].'" width="200" >';
      $output .='</li>';               
    }
$output .='</ul>';

我已尝试将其全部放在一行上,并且我也尝试将原始页面上的ul保持原样并输出li元素。我也尝试使用jsonecho作为共鸣

我可以通过刷新屏幕来应用格式,但它有点击败了使用ajax的对象

1 个答案:

答案 0 :(得分:0)

我的声誉太低,所以我无法评论,但首先,格式化是什么意思?你的意思是CSS风格?如果您显示由#selected_standards表示的元素的标记,将会有所帮助。

如果您的意思是“CSS格式化”,我怀疑您这样做:

$("#selected_standards").html(response);

您正在覆盖#selected_standards的内容,从而丢失了CSS格式。

获取分配给#selected_standards(或其子节点,取决于您的文档结构)的类的当前值,然后将这些类重新附加到之前具有它们的元素。

您可以执行类似

的操作
var previousClasses = $("#selected_standards").attr("class");
// your existing code to insert HTML
$("#selected_standards").attr("class", previousClasses);