0

我使用 jQuery 和 Ajax。当我刷新页面时，jQuery UI 效果会应用于 Ajax 响应。

但是当我发回另一个帖子时，jQuery UI 效果不适用于新的响应。

我无法弄清楚我的代码有什么问题。

这是我的代码

$(document).ready(function() {
    $("#sendemp").click(function(e) {
            e.preventDefault();
            var submit_val = $("#searchbox").val();
            //alert('submitval is ' + submit_val);


            $.ajax( {
                type : "POST",
                //dataType :"jason",
                url : "./wp-admin/admin-ajax.php",
                data : {
                    action : 'employee_pimary_details',
                    user_name : submit_val
                },
                success : function(data) {
                //      alert('hhh');
                    $('#accordion21').html(data);
                    // $( "#searchbox" ).autocomplete({
                    // source: data
                    // });
                }
            });
        });
   });

我使用 jQuery 手风琴盒。我得到的响应 $('#accordion21').html(data);将应用 jQuery UI Accordion。

在我的 php 代码中，我有以下内容

$jason .=  '<h3 style="font-size:15px;">';
    foreach($employee as $key=> $value){
        $jason .= '<table><tbody>';
        $jason .= '<tr><td style="width:400px;padding:5px;padding:10px;"></td><td style="width:300px;padding:5px;"><img style="width:132px; height:175px;" src="'.$image_folder.$value->prfil_img .'" /></td></tr>';
    //$retval .= '<a href="'. $store_url . 'product_info.php?products_id=' . $product_id . '"><img src="' . $image_folder . $product_image . '" /></a><br />';

        $jason .= '<tr><td style="width:30%;font-size:14px;paddig:10px;">'.'Name:'.'</td>'.'<td style="font-size:14px;paddig:5px;">'.$value->first_name.'&nbsp;&nbsp;'.$value->last_name.'</td></tr>';
        $jason .= '<tr><td style="width:30%;font-size:14px;paddig:10px;">'.'Email:'.'</td>'.'<td style="font-size:14px;paddig:5px;">'.$value->email;'</td></tr>';
        $jason .= '<tr><td style="width:30%;font-size:14px;paddig:10px;">'.'Tel Ext:'.'</td>'.'<td style="font-size:14px;paddig:5px;">'.$value->extension;'</td></tr>';
        $jason .= '<tr><td style="width:30%;font-size:14px;paddig:10px;">'.'att:'.'</td>'.'<td style="font-size:14px;paddig:5px;">'.$value->att;'</td></tr>';
        $jason .= '</table></tbody>';
        // echo '</br>';echo '</br>';

   }
        $jason .= '</h3>';

jQuery UI 将应用于<h3> 和<div>

http://jqueryui.com/accordion/

4

2 回答 2

0

您想初始化autocomplete页面加载，然后在后续的 ajax 请求中source通过 setter 方法分配：

$(document).ready(function() {
    $("#searchbox").autocomplete({ source: [] });
    $("#sendemp").click(function(e) {
            e.preventDefault();
            var submit_val = $("#searchbox").val();
            //alert('submitval is ' + submit_val);


            $.ajax( {
                type : "POST",
                //dataType :"jason",
                url : "./wp-admin/admin-ajax.php",
                data : {
                    action : 'employee_pimary_details',
                    user_name : submit_val
                },
                success : function(data) {
                //      alert('hhh');
                    $('#accordion21').html(data);
                     $( "#searchbox" ).autocomplete("option", "source", data);

                }
            });

        });
   });

但是 jQuery UI Autocomplete 实际上提供了自动执行此操作的代码。查看源属性的文档。

于 2013-07-17T12:09:37.763 回答
0

嗨，我可以解决这个问题，

我所做的是我改变了成功的代码

success : function(data) {
                //      alert('hhh');
                    $('#accordion3').accordion('destroy');
                    $('#accordion3').html(data);

                    $("tr:odd").css("background-color", "#F8F8F8");
                    //$("#accordion3").accordion( "disable" );
                    $("#accordion3").accordion({ active: 0 });

                }

我$(document).ready(function() {对代码做了以下更改

 $(function() {
    $("#accordion3").accordion({ 
    // heightStyle: "fill",
    active: 0 });
  });

更改上述代码的 Reson 如下链接 :) 帮助链接

于 2013-07-17T15:18:52.963 回答