Jak zmienić pozycję elementu za pomocą jQuery

Question

Mam HTML rzeczy jak poniżej:

<div class="field-group"> 
<label for="customfield_10102">select list</label> 
<select class="select" name="customfield_10102" id="customfield_10102"> 
    <option value="-1">None</option> 
</select> 
</div> 
<div class="field-group"> 
<label for="customfield_10103">select list1</label> 
<select class="select" name="customfield_10103" id="customfield_10103"> 
    <option value="-1">None</option> 
</select> 
</div> 

dowolną liczbę opcji, jak na skonfigurowany. zapytania:

1. zmienić pozycję <select class="select" name="customfield_10103" id="customfield_10103"> dołączyć z <select class="select" name="customfield_10102" id="customfield_10102"> (z 40 px marginesu), a także do zmiany zarówno Wybierz listę za szerokość.

2. Następnie wyjąć <div class="field-group"><label for="customfield_10103">select list1</label></div>

Każdy może mi zasugerować, w jaki sposób można to osiągnąć za pomocą jQuery?

UWAGA: tylko w celach informacyjnych potrzebuję takiego dostosowania w niestandardowym polu JIRA, które można uzyskać za pomocą jquery.

Innym związane zapytania:

Poniżej HTML rzeczy:

<li id="rowForcustomfield_10102" class="item"> 
    <div class="wrap"> 
     <strong title="select list" class="name">select list:</strong> 
     <div id="customfield_10102-val" class="value type-select editable-field  inactive" 
      data-fieldtype="select" title="Click to edit"> 
      final2 <span class="overlay-icon icon icon-edit-sml" /> 
     </div> 
    </div> 
</li> 
<li id="rowForcustomfield_10103" class="item"> 
    <div class="wrap"> 
     <strong title="select list1" class="name">select list1:</strong> 
     <div id="customfield_10103-val" class="value type-select editable-field inactive" 
      data-fieldtype="select" title="Click to edit"> 
      1 <span class="overlay-icon icon icon-edit-sml" /> 
     </div> 
    </div> 
    </li> 

Chcę usunąć "rowForcustomfield_10103" i właśnie to zawierało elementów "customfield_10103-val" miejsce przy następnym do „customfield_10102-Val "z pewnym marginesem. tak, po które będzie wyglądać jak poniżej:

`<li id="Li1" class="item"> 

    <div class="wrap"> 
     <strong title="select list" class="name">select list:</strong> 
     <div id="Div1" class="value type-select editable-field inactive" 
      data-fieldtype="select" title="Click to edit"> 
      final2 <span class="overlay-icon icon icon-edit-sml" /> 
     </div> 
     <div id="Div2" class="value type-select editable-field inactive" 
      data-fieldtype="select" title="Click to edit"> 
      1 <span class="overlay-icon icon icon-edit-sml" /> 
     </div> 
    </div> 
</li>` 

Proszę również daj mi znać na ten temat.

próbowali poniżej, ale nie można zmienić pozycji:

if(AJS.$("rowForcustomfield_10102").length > 0) 
{ 

AJS.$("customfield_10102-val").after(AJS.$('customfield_10103-val')); 
AJS.$('customfield_10103-val').css({ 'margin-left': '40px','width':'80px' }) 
AJS.$('customfield_10102-val').css({ 'width': '80px' }); 
AJS.$("#rowForcustomfield_10102 .name").html(null); 
AJS.$("#rowForcustomfield_10103 .name").html(null); 


} 

Answer 1

spróbować tej

$("#customfield_10102").after($('#customfield_10103')); 
    $('#customfield_10103').css({ 'margin-left': '40px','width':'200px' }) 
    $('#customfield_10102').css({ 'width': '200px' }); 
    $('[for="customfield_10103"]').closest('.field-group').remove(); 

Answer 2

Oto jeden sposób:

var $customfield_10103 = $('#customfield_10103'), $parent = $customfield_10103.parent(); 
$customfield_10103.appendTo($('#customfield_10102').parent()).css('marginLeft', '40px'); 
$parent.remove(); 

FIDDLE