复选框添加文本

时间:2013-05-22 15:21:25

标签: jquery html-table

我有几个动态填充的表。在加载时,每个复选框都会被勾选,每个文本框的值都为1。

我正在寻找一个jQuery脚本来运行,如果该复选框未被取消,那么它将用0替换文本框,如果再次勾选它,它将用1替换零。

这是我到目前为止的代码:

$('#cb').click(function() {
if($(this).is(':not(:checked'))
$(\"#tx\").val('1');
else
$(\"#tx\").val('o');
});

有人可以帮忙吗?

4 个答案:

答案 0 :(得分:5)

我想你想要这个:

不更改ID且不更改任何标记。

小提琴的确切解决方案:

$('input[type=checkbox]').click(function() {
    if(this.checked == true) {
        $(this).closest('td').next().find('input').val("1");

    } else {        
        $(this).closest('td').next().find('input').val("0");

    }
});

DEMO HERE

答案 1 :(得分:2)

您可以将更改侦听器附加到更新相应文本框的每个复选框。诀窍是如何识别与复选框对应的文本框。您可以使用复选框ID的类或变体(请记住ID必须是唯一的):

$('input[type="checkbox"]').on('change', function() {
    var val = $(this).prop('checked') ? 1 : 0;
    var txtBoxId = $(this).attr('id') + '_txt'; //in this example, the ID of a textbox is the ID of the checkbox + '_txt'
    $("#" + txtBoxId ).val(val);
});

与jQuery一样,请确保它位于ready函数中,否则可能无效。

答案 2 :(得分:1)

$('#cb').click(function() {
    if($(this).is(':not(:checked)'))
        $("#tx").val('0');
    else
        $("#tx").val('1');
    });

这是你的代码,只是清理完毕。

  • 在“已检查”
  • 后添加了缺失的括号
  • 删除了#tx
  • 周围所有奇怪的逃脱标记
  • 交换您的0和1以符合您的规则

你的小提琴也有问题 - 你需要在左上方包含jquery库,而作为一个评论者说,你不能让每个东西具有相同的id。我给你的代码更改将使你的大部分内容工作,但挑战是找出要更改的文本框。我这样做是通过在每个复选框上使用数据属性来说明要链接到的文本框的哪个(唯一)ID。

查看我的工作小提琴:http://jsfiddle.net/9NDuB/5/

答案 3 :(得分:0)

怎么样?
$('#cb').change(function() {
    this.checked ? $("#tx").val("1") : $("#tx").val("0");
});