0

radiogroup2のラジオボタンをクリックすると、選択したラジオはid='selectedradio'のラジオと位置を入れ替える必要があります。フィドルhttp://jsfiddle.net/DCC66/6/---更新---無線行とコードのクリアビューが交換されていますが、http：//jsfiddle.net/DCC66/14/がキャンセルされています

IDの問題を並べ替えるためにこれを試しました：http：//jsfiddle.net/DCC66/18/

$(".radiogroup2 input[type='radio']").on('click', function () {
    $('#radioselected').closest('label').before($(this).closest('label'));
    $(this).closest('label').after($('#radioselected').closest('label'));
    $(this).attr('domaintype', 'radioselected');
    $('radioselected').attr('radioselected', 'domaintype');
});

そして今、this：//スワップは一度停止し、クリックされたラジオが消えるだけです。新しく交換された無線機にid="radioselected"を追加する必要があると思います。また、ラジオを交換するだけですが、まだ交換していません。

$(".radiogroup2 input[type='radio']").on('click', function () 
{
    $('#radioselected').closest('label').replaceWith($(this).closest('label'));
});

クローンを使用しようとしても運がない：

$("div.radiogroup2 input[name='domain_ext']").click(function () 
{
    $(this).clone('#radioselected').after(this);
});

オリジナル

$("div.radiogroup2 input[name='domain_ext']").click(function() 
{ 
    //only if a the radio in radiogroup to are clicked take radio and swap with id='radioselected'
    if  ($(this).prop('checked')) 
    {
        $(this).after('#radioselected').add(this);
        $('#radioselected').after(this);
    }
});

したがって、「スワップ」行でクリックされたラジオは、IDが「selectedradio」の最初の行のラジオと位置を切り替える必要があります。

4

1 に答える 1

1

ラジオボタンでイベントを直接バインドする代わりに、デリゲートを使用します。そうすれば、divにスワップされるラジオボタンも機能します。

このメソッドを使用してclosest、ラジオボタンの周りのラベルを取得します。

交換するラジオボタンからIDを削除し、選択したラジオボタンに追加します。

この方法を使用してafter、ラベルを選択したリストの隣の2番目のリストにprependTo移動してから、を使用して、選択したラジオボタンのあるラベルを最初のリストに移動します。

行を入れ替える無効なHTMLコードがあります。に変更<td><tr>し<tr><td>ます。

$("div.radiogroup2").on("click", ":radio", function () {
  var l = $(this).closest('label');
  var r = $('#radioselected');
  r.removeAttr('id');
  l.after(r.closest('label'));
  $(this).attr('id', 'radioselected');
  l.prependTo('.radiogroup1');
});

デモ： http： //jsfiddle.net/DCC66/16/

于 2013-03-16T23:34:46.830 に答える