簡體   English   中英

ajax搜索更新后的jquery更新

[英]jquery updation after ajax search updation

我有一個用於刪除確認的腳本...

$('document').ready(function(){
     $('.ask').jConfirmAction();
});

並且產品列表在下面

<?php if(isset($query)){ ?>        
<input disabled type="hidden" id="recNum" value="<?php echo $rec ?>"/>
<table id="rounded-corner" summary="2007 Major IT Companies' Profit" width="100%">
    <thead>
        <tr>
            <th scope="col" class="rounded-company"></th>
            <th scope="col" class="rounded">Product ID</th>
            <th scope="col" class="rounded">Product Name</th>
            <th scope="col" class="rounded">Product slug</th>
            <th scope="col" class="rounded">Type</th>
            <th scope="col" class="rounded">Product Category</th>
            <th scope="col" class="rounded">Edit</th>
            <th scope="col" class="rounded-q4">Delete</th>
        </tr>
    </thead>
        <tfoot>
        <tr>
            <td colspan="7" class="rounded-foot-left"><em>All The Pages That Being Included</em></td>
            <td class="rounded-foot-right">&nbsp;</td>

        </tr>
    </tfoot>
    <tbody>
         <?php
     foreach($query as $key => $row) {
    ?> 
        <tr>
            <td><input type="checkbox" name="" /></td>
            <td><?php echo $row['product_id'];?></td>
            <td><?php echo $row['product_name'];?></td>
            <td><?php echo $row['product_slug'];?></td>
            <td><?php echo $row['type'];?></td>
            <td><img src="<?php echo base_url().$row['product_image'];?>" width="80px" height="80px"/></td>
            <td><a href="<?php echo base_url();?>admin.php/products/edit_product/<?php echo $row['product_id'];?>"><img src="<?php echo base_url();?>assets/admin_assets/images/user_edit.png" alt="" title="" border="0" /></a></td>
            <td><a href="<?php echo base_url();?>admin.php/products/delete_product/<?php echo $row['product_id'];?>" class="ask"><img src="<?php echo base_url();?>assets/admin_assets/images/trash.png" alt="" title="" border="0" /></a></td>
        </tr>
        <?php
        }?>


    </tbody>
</table>

     <a href="<?php echo base_url();?>admin.php/products/add_product" class="bt_green"><span class="bt_green_lft"></span><strong>Add new item</strong><span class="bt_green_r"></span></a>
     <a href="<?php echo base_url();?>admin.php/products/view_product" class="bt_blue"><span class="bt_blue_lft"></span><strong>View all items from category</strong><span class="bt_blue_r"></span></a>
     <a href="#" class="bt_red"><span class="bt_red_lft"></span><strong>Delete items</strong><span class="bt_red_r"></span></a> 

繼承jQuery的jQuery確認:

/*
 * jQuery Plugin : jConfirmAction
 * 
 * by Hidayat Sagita
 * http://www.webstuffshare.com
 * Licensed Under GPL version 2 license.
 *
 */
(function($){

    jQuery.fn.jConfirmAction = function (options) {
        // Some jConfirmAction options (limited to customize language) :
        // question : a text for your question.
        // yesAnswer : a text for Yes answer.
        // cancelAnswer : a text for Cancel/No answer.
        var theOptions = jQuery.extend ({
            question: "Are You Sure ?",
            yesAnswer: "Yes",
            cancelAnswer: "Cancel"
        }, options);

        return this.each (function () {

            $(this).bind('click', function(e) {

                e.preventDefault();
                thisHref    = $(this).attr('href');

                if($(this).next('.question').length <= 0)
                    $(this).after('<div class="question">'+theOptions.question+'<br/> <span class="yes">'+theOptions.yesAnswer+'</span><span class="cancel">'+theOptions.cancelAnswer+'</span></div>');

                $(this).next('.question').animate({opacity: 1}, 300);

                $('.yes').bind('click', function(){
                    window.location = thisHref;
                });

                $('.cancel').bind('click', function(){
                    $(this).parents('.question').fadeOut(300, function() {
                        $(this).remove();
                    });
                });

            });

        });
    }

})(jQuery);

一切都運轉良好,

然后我對列表做了ana jax分頁;

現在的問題是,完成此任務后,jQuery確認無法正常工作,我希望將jQuery腳本轉換為這樣的簡單jQuery函數

function ask()
{

}

編輯:

我已經寫了函數

function ask(obj)
{
alert('hii');
                    //var theOptions = jQuery.extend ({
            var question= "Are You Sure ?";
            var yesAnswer= "Yes";
            var cancelAnswer= "Cancel";
            //e.preventDefault();

                    var thisHref = $(obj).attr('href');
            alert(thisHref) ;
                if($(obj).next('.question').length <= 0)
                    $(obj).after('<div class="question">'+question+'<br/> <span class="yes">'+yesAnswer+'</span><span class="cancel">'+cancelAnswer+'</span></div>');

                $(obj).next('.question').animate({opacity: 1}, 300);

                $('.yes').bind('click', function(){
                    window.location = thisHref;
                });

                $('.cancel').bind('click', function(){
                    $(obj).parents('.question').fadeOut(300, function() {
                        $(obj).remove();
                    });
                });

}

我從這里打電話

<a href="<?php echo base_url();?>admin.php/products/delete_product/<?php echo $row['product_id'];?>" class="ask" onclick="ask(this);"><img src="<?php echo base_url();?>assets/admin_assets/images/trash.png" alt="" title="" border="0" /></a>

它也起到了作用; 但是在動畫效果剛過之后,它就被重定向到了鏈接,我需要使其停留,以便用戶可以選擇該選項。 但是我不能...

MORE EDIT:

好吧,我得到了答案; 我用小的代碼返回false,它解決了我的問題

但是還有另一個問題

這行代碼不起作用

$('.cancel').bind('click', function(){
                        $(obj).parents('.question').fadeOut(300, function() {
                            $(obj).remove();
                        });
                    });

您需要綁定$('.ask').jConfirmAction(); 轉到新頁面后,再次訪問所有鏈接。

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM