1

私のコードは、チェックしたラジオを見つけてから、次の要素を見つけて、必要な div にそのコンテンツを追加します。ただし、別のラジオをチェックしてから前の div に戻ると、先頭に追加されたコンテンツが保持され、再び先頭に追加されます。そのため、divで重複してしまいます。

HTML:

<form>
    <input type="radio" name="form" value="informed"/>
    <span>INFORMED CONSENT</span><br />
    <input type="radio" name="form" value="release"/>
    <span>RELEASE OF INFORMATION</span><br />
    <input type="radio" name="form" value="intake"/>
    <span>INTAKE FORM</span><br />
    <input type="radio" name="form" value="checklist"/>
    <span>CHECKLIST OF CONCERNS (CHILD & ADOLESCENT AND ADULT)</span><br />
    <input type="radio" name="form" value="health"/>
    <span>HEALTH INFORMATION PRIVACY FORM</span><br />
</form>

<div id="informed" class="Form">1</div>
<div id="release" class="Form">2</div>
<div id="intake" class="Form">3</div>
<div id="checklist" class="Form">4</div>
<div id="health" class="Form">5</div>
<div id="ContactFormSix" class="Form">6</div>

JS

var myForm = new Array("INFORMED CONSENT","RELEASE OF INFORMATION","INTAKE FORM");
$(document).ready(function () {
   $('input').on( 'change', function () {
      //check
      var ValUe = $(this).val();
      $('.Form').hide();
      $('#' + ValUe).show();
      //Find the value of the input that was clicked
      var formVaule = $('input[value="' + ValUe + '"]');
      //Grab the value of the input that was clicked and find the next element and retreive the text
      var k = formVaule.next().text();
      //PrePend the elemnts text   
      $('#' + ValUe).prepend(k);
   })
});
4

2 に答える 2

0

データを追加する前に、divをクリーンアップしてから、次のように追加します。

$('#' + ValUe).empty(k);
$('#' + ValUe).prepend(k);
于 2013-03-11T21:47:54.213 に答える
0

これを使用.prepend()または.append()使用.html()する代わりに、対象の要素の元のデータを置き換えます。

例えば $('#' + ValUe).html(k);

アニメーションの例

ほんの一例ですが、他の多くの方法で実現できます。

$('#' + ValUe).html(<span style="opacity:0;">k</span>);
$('#' + ValUe span).animate({opacity:1},slow);
于 2013-03-11T21:40:18.947 に答える