0

当我使用 ajax 时,我注意到 Jquery 效果不起作用。原因是“当您的 jquery 第一次运行时,您添加到 DOM(页面)的新 HTML 不存在” 另一个类似的问题

因此,我将代码更改为以下,但仍然没有得到 jquery 效果。

我在哪里做错了?

以前的代码

$("#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
                // });

            }
        });

    });

新代码

$("button").on( "click", "#accordion3",function(){ 

$.ajax( {
    type : "POST",
    dataType : "json",
    url : "./wp-admin/admin-ajax.php",
    data : {
        action : 'employee_deatils_search',
        user_name : submit_val
    },
    success : function(data) {
    //      alert('hhh');


        $('#accordion3').html(data);
        $("tr:odd").css("background-color", "#F8F8F8");
        $("#accordion3").accordion({ heightStyle: "fill", active: 0 });
        // $( "#searchbox" ).autocomplete({
        // source: data
        // });

    }
});



} );

我有以下提交按钮

<input type="submit" id="sendemp" value="Search" />
4

3 回答 3

0

我认为您的点击绑定不正确,如果您想处理内部按钮的点击,请将#accordion3其更改为:

$("#accordion3").on( "click", "button",function(){...}); 
于 2013-07-17T06:54:45.430 回答
0

没有您的 html 很难判断,但看起来在您的旧代码中您正在替换 sendemp 按钮。在您的新代码中,您的事件委托指定不正确。您正在将委托应用于按钮元素(由于您的 sendemp 按钮是输入元素,因此该元素不存在)。

将委托应用于#sendemp 的父对象,如下所示:

$('body').on('click', '#sendemp', function() {
     // your ajax call
});
于 2013-07-17T13:49:08.437 回答
0

我可以解决这个问题,我尝试了上述使用on方法的解决方案。但是,这对我的问题没有意义。

正如我认为的以下文章解释,Accordion 已经实例化并且效果是持久性的。第二次调用时,由于已经有效果,所以不会再次创建。

因此,我需要摧毁它并重建手风琴。 支持链接

我将成功的代码更改如下

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 });
  });
于 2013-07-17T15:13:52.990 回答