如何使用jQuery删除HTML复选框

杰里米

具有一组复选框,例如:

   <div class="checkbox checkbox-inline">
        <label id="test">
            <input type="checkbox" class="icheck" checked value="<?=$skill->name; ?>"> <?=$skill->name; ?>
        </label>
    </div>
   <div class="checkbox checkbox-inline">
        <label id="test">
            <input type="checkbox" class="icheck" checked value="<?=$skill->name; ?>"> <?=$skill->name; ?>
        </label>
    </div>

我有以下JS

$('#test').on('click', null, function(){
    alert("Clicked");
    $(this).remove();
});

我正在尝试的是在用户单击标签时删除各个复选框(及其标签)。

我想要这样的东西:

   <div class="checkbox checkbox-inline">
        <label id="test" onClick="removeMe()">
            <input type="checkbox" class="icheck" checked value="<?=$skill->name; ?>"> <?=$skill->name; ?>
        </label>
    </div>

在我的JavaScript上:

function removeMe(){
// Do some AJAX GET/POST
$.ajax....

// and finally
$(this).remove() // i am not sure how to do this....
}

谁能指出我正确的方向?谢谢

编辑:

所以这是我使用的解决方案:

function removeMe(object, skillId, personId){
    $.ajax({
        type: 'POST',
        url: SOME_URL_GOES_HERE,
        dataType: 'json',
        data: { skill_id: skillId, person_id: personId },
        success: function(data, textStatus, jqXHR){
            noty({
                text: data.message,
                layout: 'topRight',
                type: data.response
            });
            $(object).remove();
        },
        error: function(data){
            console.log(data);
            noty({
                layout: 'topRight',
                text: 'Failed to delete record, please try again.',
                type: 'error'
            });
        }
    });
}

并建议,我使用.class代替id。

编码代码

在您的第一个代码中,有多个具有相同ID的标签。每个元素都应该有唯一的ID,这就是为什么您的代码不适用于第一个代码。提供类或其他属性而不是ID

对于第二个代码,您应该执行以下操作:

<div class="checkbox checkbox-inline">
   <label id="test" onClick="removeMe(this)"> <!--pass the object of current element-->
       <input type="checkbox" class="icheck" checked value="<?=$skill->name; ?>"> <?=$skill->name; ?>
   </label>
</div>

和您的JS代码:

function removeMe(that){
  // Do some AJAX GET/POST
  $.ajax....

  $(that).remove(); 
}

您需要在函数中传递对象。

本文收集自互联网,转载请注明来源。

如有侵权,请联系[email protected] 删除。

编辑于
0

我来说两句

0条评论
登录后参与评论

相关文章

来自分类Dev

如何使用jQuery删除输入复选框

来自分类Dev

javascript & html - 如何删除复选框

来自分类Dev

jQuery:删除复选框后如何回调/还原

来自分类Dev

使用jQuery的复选框

来自分类Dev

定位复选框并使用Jquery将其删除

来自分类Dev

复选框单击,然后使用jQuery删除验证

来自分类Dev

如何使用jQuery向ul添加和删除复选框的值

来自分类Dev

当使用jQuery中的复选框未选中元素时,如何删除元素?

来自分类Dev

如何根据仅使用javascript选中的复选框添加/删除html元素?

来自分类Dev

如何使用jQuery显示复选框旁边的复选框文本

来自分类Dev

如何使用复选框删除列表视图项?

来自分类Dev

如何使用复选框删除多个条目?(PHP)

来自分类Dev

如何使用左侧的复选框从地图上删除标记?

来自分类Dev

如何使用php中的复选框删除记录?

来自分类Dev

如何使用复选框删除多条记录?

来自分类Dev

如何使用复选框列从DataGridView删除多个项目

来自分类Dev

如何使用复选框删除列表视图项?

来自分类Dev

如何通过Ajax调用使用复选框删除多个

来自分类Dev

如何使用复选框附加和删除不同的 div

来自分类Dev

如何使用 Angular 2 中的复选框删除多行?

来自分类Dev

在jQuery中删除选中的复选框

来自分类Dev

如何使用jQuery创建带有复选框的HTML按钮?

来自分类Dev

如何使用jQuery处理从另一个PHP文件填充的html复选框?

来自分类Dev

如何使用JavaScript或jquery选中/取消选中复选框?

来自分类Dev

如何使用jQuery或JavaScript选择所有复选框?

来自分类Dev

如何使用JQuery在表中查找复选框?

来自分类Dev

如何使用jQuery处理两个复选框

来自分类Dev

如何使用jQuery增加复选框值?

来自分类Dev

如何使用jQuery启用/禁用嵌套复选框

Related 相关文章

  1. 1

    如何使用jQuery删除输入复选框

  2. 2

    javascript & html - 如何删除复选框

  3. 3

    jQuery:删除复选框后如何回调/还原

  4. 4

    使用jQuery的复选框

  5. 5

    定位复选框并使用Jquery将其删除

  6. 6

    复选框单击,然后使用jQuery删除验证

  7. 7

    如何使用jQuery向ul添加和删除复选框的值

  8. 8

    当使用jQuery中的复选框未选中元素时,如何删除元素?

  9. 9

    如何根据仅使用javascript选中的复选框添加/删除html元素?

  10. 10

    如何使用jQuery显示复选框旁边的复选框文本

  11. 11

    如何使用复选框删除列表视图项?

  12. 12

    如何使用复选框删除多个条目?(PHP)

  13. 13

    如何使用左侧的复选框从地图上删除标记?

  14. 14

    如何使用php中的复选框删除记录?

  15. 15

    如何使用复选框删除多条记录?

  16. 16

    如何使用复选框列从DataGridView删除多个项目

  17. 17

    如何使用复选框删除列表视图项?

  18. 18

    如何通过Ajax调用使用复选框删除多个

  19. 19

    如何使用复选框附加和删除不同的 div

  20. 20

    如何使用 Angular 2 中的复选框删除多行?

  21. 21

    在jQuery中删除选中的复选框

  22. 22

    如何使用jQuery创建带有复选框的HTML按钮?

  23. 23

    如何使用jQuery处理从另一个PHP文件填充的html复选框?

  24. 24

    如何使用JavaScript或jquery选中/取消选中复选框?

  25. 25

    如何使用jQuery或JavaScript选择所有复选框?

  26. 26

    如何使用JQuery在表中查找复选框?

  27. 27

    如何使用jQuery处理两个复选框

  28. 28

    如何使用jQuery增加复选框值?

  29. 29

    如何使用jQuery启用/禁用嵌套复选框

热门标签

归档