0

我有一个使用 Bootstrap 3 的表,如果用户确认使用 Bootbox.js,我想使用每行中的按钮删除一行。

我需要它来删除包含按钮的行。当我单击按钮时会触发确认,但当我单击“是”时,该行不会被删除。

如果我注释掉 Bootbox 部分并仅$(this).parentsUntil('tbody').remove();在 click() 事件上使用,它会按预期工作,但一旦我取消注释,它就不起作用

这是页脚中的 JS 包含和 JS

<script src="<?=URL; ?>public/js/bootstrap.min.js"></script>
<script src="<?=URL; ?>public/js/bootbox.min.js"></script>
<script>
    $(document).ready(function(){
        $(document).on('click', '.complete', function(e) {
            //e.preventDefault();
            bootbox.confirm("Are you sure want to delete?", function(result) {
                if(result) {
                    $(this).parentsUntil('tbody').remove();
                    console.log('removed');
                }   
                else {
                    console.log('not remvoed');
                }
            });
        });
    });
</script>

这是桌子

<div class="table-responsive">
    <table class="table table-hover table-bordered">
        <thead>
            <tr>
                <th>Type</th>
                <th>Complete?</th>
            </tr>
        </thead>
        <tbody>
        <?php foreach($this->tasks as $task):?>
        <tr>
            <td><?php echo $task['type']; ?></td>
            <td>
                <button type="button" class="btn btn-default btn-lg complete">
                    Default Button
                </button>
            </td>
        </tr>   
        <?php endforeach?>
        </tbody>
    </table>
</div>
4

1 回答 1

2

这是一个小提琴:http: //jsfiddle.net/afP5N/1/

您所拥有的是范围问题-回调中的“this”与单击事件中的“this”不同。

为简单起见,我将 bootbox.confirm 设为空对象的函数,并添加了一些控制台输出以向您展示“this”如何变化。

var _this = this; //saves a reference to the original 'this'
于 2014-06-13T15:41:02.263 回答