在单击单选按钮上附加输入框的文本

Question

单击特定单选按钮时，我一直尝试附加输入框的值。

单选按钮行是动态生成的。 每行将有7个单选按钮。

单击按钮时，行id及其值将使用数组放入文本区域。 但是，现在当单击最后一个单选按钮（缺失）时，不仅需要附加行id和值，还需要附加显示的输入框的文本。

到目前为止，我们有14001290~01~01~CD0 | 15489587~03~01~CM ，其中CDO和CM是单选按钮的值，前面是行ID。

我们现在需要的是14001290~01~01~CD0 | 15489587~03~01~CM~追加本文| 87554585~02~04~CD1 ？

这是我的代码。

$("input:radio").hover(
function() {
$(this).prev('.r-title').show();
  }, function() {
if (!$(this).is(':checked')) {
    $(this).siblings('.r-title, .m-notes').hide();
  }
});
$("input:radio").click( 
function () {
$(this).parent().parent().find('.r-title, .m-notes').hide();
var totalRd = $('table').find(':not(.pend) > input:radio:checked').length;
var clicked =[];
$("#totalRd .rd-count").html(totalRd);
$(this).siblings('.r-title, .m-notes').show(); 
$('table').find(":not(.pend) >input[type=radio]:checked").each(function() {
var selectedId = $(this).parent().parent().attr('id');
clicked.push(selectedId+"~"+this.value); 
}); //checked
$("#inputhere").val(clicked.join('|'));
});

在这里小提琴

希望有人能帮助我。 如果你不确定这个问题请问？ 谢谢

Answer 1

我想这就是你想要做的：

$('table').find(":not(.pend) >input[type=radio]:checked").each(function () {
    var selectedId = $(this).parent().parent().attr('id');
    var newVal = ($(this).next('.m-notes:visible').length) ? this.value + "~" + $(this).next('.m-notes:visible').val() : this.value;
    clicked.push(selectedId + "~" + newVal);
}); //checked
$("#inputhere").val(clicked.join('|'));

根据您的最新评论，您可以添加：

$('.m-notes').keyup(function () {
   var $self = $(this);
   var clicked = [];
   $('table').find(":not(.pend) >input[type=radio]:checked").each(function () {
      var selectedId = $(this).parent().parent().attr('id');
      var newVal =  this.value + "~" + $(this).next('.m-notes').val();
      clicked.push(selectedId + "~" + newVal);
   }); //checked
   $("#inputhere").val(clicked.join('|'));
});

---

var newVal尝试声明此var并执行三元操作以检查下一个.m-notes文本框是否可见，如果可见则将radio值连接到textbox值。

你可以看看这个小提琴。

更新了小提琴

Answer 2

像这样的东西：

JSFiddle： http ： //jsfiddle.net/TrueBlueAussie/jj4Uv/22/

随意删除所有评论:)基本上它更新文本框和无线电检查更改的密钥。

// Hover shows/hides the additional information
$("input:radio").hover(function () {
    $(this).prev('.r-title').show();
}, function () {
    if (!$(this).is(':checked')) {
        $(this).siblings('.r-title, .m-notes').hide();
    }
});

/* $this is the radio button */    
function updateSummary($this){
    $this.closest('[id]').find('.r-title, .m-notes').hide();
    var totalRd = $('table').find(':not(.pend) > input:radio:checked').length;

    // Array of clicked items
    var clicked = [];

    // Set number of selected items
    $("#totalRd .rd-count").html(totalRd);

    // Show the title and notes next to the radio button
    $this.siblings('.r-title, .m-notes').show();

    // Find all checked radio buttons
    $('table').find(":not(.pend) >input[type=radio]:checked").each(function () {
        // Find closest ancestor with an id
        // See if we have a text box, if so use the text
        var $text = $(this).siblings('input[type=text]:visible');
        var selectedId = $(this).closest('[id]').attr('id');
        var value = selectedId + "~" + $(this).val();
        if ($text.length)
        {
            value += "~" + $text.val();
        }
        clicked.push(value);
    }); //checked

    // Display the selected ids 
    $("#inputhere").val(clicked.join('|'));
}

// Radio selection changes selected options
$("input:radio").click(function () {
    updateSummary($(this));    
});
$('input[type=text].m-notes').bind('keyup', function () {
    // Pass the target radio button to our helper
    updateSummary($(this).siblings(':radio'));
});

我注意到你使用的是旧版本的JQuery，否则我会将事件切换为使用委托版本的on而不是`bind'。

Answer 3

$("input:radio").hover(function() {
    $(this).prev('.r-title').show();
}, function() {
    if (!$(this).is(':checked')) {
        $(this).siblings('.r-title, .m-notes').hide();
    }
});
$("input:radio").click(function () {
    $(this).parent().parent().find('.r-title, .m-notes').hide();
    var totalRd = $('table').find(':not(.pend) > input:radio:checked').length;
    var clicked =[];
    $("#totalRd .rd-count").html(totalRd);
    $(this).siblings('.r-title, .m-notes').show(); 
    $('table').find(":not(.pend) >input[type=radio]:checked").each(function() {
var selectedId = $(this).parent().parent().attr('id');
var text = $(this).siblings('input.m-notes:visible').val();
clicked.push(selectedId+"~"+this.value+text); 
 }); //checked
    $("#inputhere").val(clicked.join('|'));
});

你需要一些如果检查不是一个空字符串并在你的字符串之前添加'〜'