AJAX 刷新后从表中隐藏 <td>答案

【问题标题】：Hide <td> from table after AJAX refreshAJAX 刷新后从表中隐藏 <td>
【发布时间】：2016-03-12 17:15:03
【问题描述】：

我有一个带有隐藏列 (td class="gtr") 的 HTML 表格。当我刷新浏览器时，该列保持隐藏状态。但是，页面中间有一个提交按钮，要求用户输入他们的位置（区域）。此按钮使用 AJAX。当我刷新 AJAX（使用提交按钮）时，表格显示了我试图隐藏的列。

关于如何在 AJAX 刷新后自动隐藏此列有什么建议吗？

这里是 HTML：

            $schedule_in_arr = Direction_Session::get('schedule_id');
            $data_by_time = Direction_Session::get('data_by_time', array());
            ?>
            <?php if (!empty($value['schedule_info'])): ?>
                <table class="jz-table jz-table-bordered jz-table-striped">
                    <caption><?php echo $value['location_name']; ?></caption>
        <?php if (!empty($value['schedule_info'])): ?>
                        <thead>
                            <tr>
                                <td class="start">Start Date</td>
                                <td class="duration" style="text-align: center;">Duration</td>
                                <td class="time" style="text-align: center;">Time</td>
                                <td class="gtr" style="display:none"><span class="jz-popover-item" data-content="Guaranteed to Run">GTR</span></td>
                            </tr>
                        </thead>
                        <tbody>

这里是 Javascript：

var DirectionsBaseCourses = function () {
var handleValidation = function () {
    jQuery('.loading').hide();
    jQuery('#btnShowClases').click(function () {
        var region_id = jQuery('#region_id').val();
        var from_date = jQuery('#fromDate').val();
        var to_date = jQuery('#toDate').val();
        var course_no = jQuery('#course_no').val();
        var course_id = jQuery('#course_id').val();
        if (region_id == "") {
            jQuery('<div title="Message">Please select a region</div>').dialog({
                modal: true,
                width: 200,
                height: 100
            });
        } else {
            jQuery('.loading').show();
            var dataArr = {'region_id': region_id, 'from_date': from_date, 'to_date': to_date, 'course_no': course_no, 'course_id': course_id,};
            jQuery.ajax({
                url: Drupal.settings.basePath + "course/search/region/api",
                type: 'post',
                cache: false,
                datatype: 'json',
                data: dataArr,
                success: function (result) {
                    jQuery('.loading').hide();
                    var parsed = JSON.parse(result);
                    //jQuery('.result_search_region').html(result.data);
                    if (parsed.data.length > 0) {
                        jQuery('.result_search_region').html(' ');
                        jQuery('.result_search_region').append('<h5>Course Availability</h5>');
                        jQuery('.result_search_region').append(parsed.data);
                            $('td table').empty();
                    }
                    else{
                        jQuery('.result_search_region').html(jQuery('#dt_no_schedule').html());
                    }


                }
            });
        }
    });
};
return {
    init: function () {
        handleValidation();
    }
};

}();

【问题讨论】：

标签： javascript jquery json ajax html-table

【解决方案1】：

如果该列在 DOM 中仍然存在具有相同的类 gtr，您可以使用以下方法将其隐藏在 success 中：

$('.gtr').hide();

希望这会有所帮助。

【讨论】：

其实我刚查了一下，我的 DOM 上的 gtr 类不一样。我不知道如何纠正 DOM。你介意帮助我吗？如何向 DOM 添加相同的类？
请@CQuinn 在 OP 中的 ajax 调用后添加 DOM。