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('|'));
});

Fiddle here

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

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值。

You can take a look at this fiddle.

Updated fiddle

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＆＃39;。

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('|'));
});

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

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

3 个答案:

You can take a look at this fiddle.

Updated fiddle

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