繁体   English   中英

Jquery 不适用于 AJAX 响应

[英]Jquery is not working on AJAX response

我的工作代码中有三个部分:

  1. 一个 PHP 文件,
  2. 一个 jQuery 代码部分,其中包含一个请求的 AJAX 函数,
  3. 另一个 PHP 文件。

响应是一个 HTML 部分,它应该被添加到第一个 PHP 文件中的 DIV 之前(从这里使用 PHP 文件的<head>部分内的<head> <script>标记中的 jQuery 部分请求 AJAX。

我的查询是,当 AJAX 在所需的 DIV 元素id="content"成功动态添加 HTML 时,以响应 HTML 元素标签为目标的其他点击事件无法动态工作。
可能是什么原因?

$(".update_button").click(function (){
    var updateval = $("#update").val();
    var cate = $("#selectcategory").val();
    var up = $("#uploadvalues").val();
    if (up)
    {
        var uploadvalues = $("#uploadvalues").val();
    }
    else
    {
        var uploadvalues = $(".preview:last").attr('id');
    }
    var X = $('.preview').attr('id');
    if (X)
    {
        var Z = X + ',' + uploadvalues;
    }
    else
    {
        var Z = 0;
    }
    var dataString = 'update=' + updateval + '&Category=' + cate + '&uploads=' + Z;
    if ($.trim(updateval).length == 0 || $("#selectcategory").val() === "")
    {
        if ($.trim(updateval).length == 0)
        {
            alert('Please Enter SOME TEXT!');
        }
        else if ($("#selectcategory").val() === "")
        {
            alert('Choose a Category from the list!');
        }
    }
    else
    {
        $.ajax({
            type: "POST",
            url: $.base_url + "message_ajax.php",
            data: dataString,
            cache: false,
            success: function (html)
            {
                $("#flash").fadeOut('slow');
                $(".teacherpost").prepend(html);
                $("#update").val('').focus();
                $("#selectcategory").val('');
                $('#preview').html('');
                $('#uploadvalues').val('');
                $('#photoimg').val('');
                $(".decoration").hide();
            }
        });
    }
    return false;
});

来自 AJAX resposne 的 HTML:

<div class="post-description">
    <div class="stats">
        <div class="st_like_share">
            <a class="Like" href="javascript:void(0)" id='like<?php echo $msg_id;?>' title='<?php echo $like_status;?>' rel='<?php echo $like_status;?>' data='<?php echo $shareKey; ?>'><i class="glyphicon glyphicon-star" style="color:#F16522;"></i><?php  echo  $like_count; ?></a>
            <?php  } else {    ?>  
            <a class="Like" href="javascript:void(0)" id='like<?php echo $msg_id;?>' title='<?php echo $like_status;?>' rel='<?php echo $like_status;?>' data='<?php echo $shareKey; ?>'><i class="glyphicon glyphicon-star" ></i><?php echo  $like_count;  ?></a>              
            <?php } ?>                                         
            <a href="javascript:void(0)" class="stat-item remark" data-id="<?php 
                echo $msg_id;?>"  title='Give your Remarks on it'>
            <i class="fa fa-comments-o icon"></i><?php echo  $remark_count;  ?>
            </a>                          
            <a href="javascript:void(0)" class="stdelete stat-item" data-id="<?php echo $omsg_id;?>"  rel="" title="Delete Post">
            </a>
            <?php }  
                ?>
        </div>
    </div>
</div>
<div class="post-footer" id="post-footer-<?php echo $msg_id;?>">
    <textarea name="comment" class="form-control add-comment-input" id="ctextarea<?php echo $omsg_id;?>" style="width:100%;" placeholder="Add a remark here..."></textarea>
    <span class="input-group-btn">
        <input type="submit"  value="Remark" name="Remark"  id="<?php echo $omsg_id;?>" rel="<?php echo $msg_id;?>" class="btn btn-info pull-right Remark_button">
        <!--<input  type="submit" id=""  value="Send" class="btn btn-default go-chat pull-right ">-->
    </span>
    <?php if($remark_count>0)   { ?>
    <ul class="comments-list" id="commentload<?php echo $msg_id;?>">
        <?php include('comments_load.php'); ?>
    </ul>
    <?php } ?>
</div>
</div>

不适用于 AJAX 响应的 HTML 代码的 jQuery:

/*Remark Load */
$(".stat-item.remark").on("click", function( e ) {
    var post_footer_id = "#post-footer-"+$(this).data('id');
    $(post_footer_id).slideToggle();
});

动态这不起作用,但是当我刷新页面时,这个 jQuery 工作正常。

像这样尝试

$(document).on('click', '.stat-item.remark', function(){ 
         var post_footer_id = "#post-footer-"+$(this).data('id');
      $(post_footer_id).slideToggle();
  }); 
$.ajax({
    type: "POST",
    url: $.base_url + "message_ajax.php",
    data: dataString,
    cache: false
})
.done((data) => {
    //on success code here
})
.fail((jqXhr) => {
    //on failure code here
    //jqXhr.responseJSON
});

非常感谢!它正在为我工​​作。

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM