1

我在使用 parent() 从两个输入框中检索值时遇到问题。和 next() 函数。. 在我看来，这应该有效！谁能看到我错过了什么？

谢谢。

我有这个HTML

<tr>
<td class='headline2' style="width: 200px; padding-bottom: 20px; padding-top:20px; padding-left: 10px; text-align: left;"><?= $value['f_name'] . " " . $value['l_name']; </td>
<td class='headline2'><?= $value[0]->end ?><br><?= $value[0]->start ?></td>
<td class='headline2'style='padding-right:18px;'><?= $value[0]->updated ?></td>
<td><div class="approve"><input disabled  <? if ($value[0]->studentApproved == 1) { ?>checked<? } ?>  type="checkbox"><label><span></span></label></div></td>
<td><div class="approve"><input disabled  <? if ($value[0]->companyApproved == 1) { ?>checked<? } ?>  type="checkbox"><label><span></span></label></div></td>
<td><div class="approve"><input class="approveME" value="<?= $value[0]->application_id ?>"   <? if ($value[0]->koordinatorApproved == 1) { ?>checked<? } ?>  id="<?= $i ?>" type="checkbox"><label for="<?= $i ?>" ><span></span></label></div></td>
<td><input class="deleteME "type="image" src="../wp-content/themes/tutorial_theme/images/DELETE.png"><td>
</tr> 
<input class="hidden" value="<?= $value[1] ?>">
<input class="hidden" value="<?= $value[0]->user_id ?>">

而这个JQUERY

 $('.content').on('click', '.deleteME', function() {
    var class_id = $(this).parent().parent().next().val();
    var user_id = $(this).parent().parent().next().next().val();

    $.ajax({
        type: "POST",
        url: (my_ajax_script.ajaxurl),
        data: ({action: 'delete_student_from_class', class_id: class_id, student_id: user_id}),
        success: function(msg) {
            alert("data something" + msg);
        }

    });
});
4

2 回答 2

1

您不应该直接在 table 中包含 html 元素，而是需要将它们放在一些 td.xml 中。应该更改html。您可以在 .deleteME 之后的新 td 的同一行中添加隐藏字段。

html

tr>
<td class='headline2' style="width: 200px; padding-bottom: 20px; padding-top:20px; padding-left: 10px; text-align: left;"><?= $value['f_name'] . " " . $value['l_name']; </td>
<td class='headline2'><?= $value[0]->end ?><br><?= $value[0]->start ?></td>
<td class='headline2'style='padding-right:18px;'><?= $value[0]->updated ?></td>
<td><div class="approve"><input disabled  <? if ($value[0]->studentApproved == 1) { ?>checked<? } ?>  type="checkbox"><label><span></span></label></div></td>
<td><div class="approve"><input disabled  <? if ($value[0]->companyApproved == 1) { ?>checked<? } ?>  type="checkbox"><label><span></span></label></div></td>
<td><div class="approve"><input class="approveME" value="<?= $value[0]->application_id ?>"   <? if ($value[0]->koordinatorApproved == 1) { ?>checked<? } ?>  id="<?= $i ?>" type="checkbox"><label for="<?= $i ?>" ><span></span></label></div></td>
<td><input class="deleteME "type="image" src="../wp-content/themes/tutorial_theme/images/DELETE.png"><td>
<td>
<input class="hidden" value="<?= $value[1] ?>">
<input class="hidden" value="<?= $value[0]->user_id ?>">
</td>
</tr>

Javascript

var class_id = $(this).closest('tr').find('.hidden:eq(0)').val();
var user_id =  $(this).closest('tr').find('.hidden:eq(1)').val();

或者

var class_id = $(this).parent().next('td').find('.hidden:eq(0)').val();
var user_id =  $(this).parent().next('td').find('.hidden:eq(1)').val();
于 2013-11-04T16:02:15.910 回答
0

parent()可能会令人困惑，并且当您的 DOM 更改时，它会破坏您的代码。

也许你可以尝试这样的事情：

HTML

<tr>
<td class='headline2' style="width: 200px; padding-bottom: 20px; padding-top:20px; padding-left: 10px; text-align: left;"><?= $value['f_name'] . " " . $value['l_name']; </td>
<td class='headline2'><?= $value[0]->end ?><br><?= $value[0]->start ?></td>
<td class='headline2'style='padding-right:18px;'><?= $value[0]->updated ?></td>
<td><div class="approve"><input disabled  <? if ($value[0]->studentApproved == 1) { ?>checked<? } ?>  type="checkbox"><label><span></span></label></div></td>
<td><div class="approve"><input disabled  <? if ($value[0]->companyApproved == 1) { ?>checked<? } ?>  type="checkbox"><label><span></span></label></div></td>
<td><div class="approve"><input class="approveME" value="<?= $value[0]->application_id ?>"   <? if ($value[0]->koordinatorApproved == 1) { ?>checked<? } ?>  id="<?= $i ?>" type="checkbox"><label for="<?= $i ?>" ><span></span></label></div></td>
<td><input class="deleteME data-class="<?= $value[1] ?>" data-user="<?= $value[0]->user_id ?>" "type="image" src="../wp-content/themes/tutorial_theme/images/DELETE.png"><td>
</tr>

JS

$('.content').on('click', '.deleteME', function() {
    var class_id = $(this).data('class');
    var user_id = $(this).data('user');

    $.ajax({
        type: "POST",
        url: (my_ajax_script.ajaxurl),
        data: ({action: 'delete_student_from_class', class_id: class_id, student_id: user_id}),
        success: function(msg) {
            alert("data something" + msg);
        }

    });
});

参考：jQuery .data()

从 jQuery 1.4.3 开始，HTML 5 的数据属性将被自动拉入到 jQuery 的数据对象中。

于 2013-11-04T16:11:45.100 回答