0

基本的なレイアウト：

<textarea id="courseText"></textarea>

<ul class="chapter-items">

    <li id="chap1link">Chapter 1</li>
    <input id="chap1value" type="hidden" value="I am he as you are he as you are me and we are all together" />

    <li id="chap2link">Chapter 2</li>
    <input id="chap2value" type="hidden" value="See how they run like pigs from a gun, see how they fly" />

    <li id="chap3link">Chapter 3</li>
    <input id="chap3value" type="hidden" value="I'm crying" />

</ul>

対応する非表示フィールドの値でliがクリックされるたびに、textareacourseTextを更新することは可能ですか？

chap1link liをクリックすると、chap1valueの値がテキストエリアに読み込まれます。

アドバイスをいただければ幸いです。ありがとう！

4

1 に答える 1

3

試す：

$(".chapter-items li").click(function(){    
    $("#courseText").val($(this).next('input[type=hidden]').val());
});

サンプル

ただし、次のhtmlマークアップをお勧めします（a内にあるものはすべてに含まれているul必要がありますli）

<ul class="chapter-items">
    <li id="chap1link">Chapter 1
    <input id="chap1value" type="hidden" value="I am he as you are he as you are me and we are all together" />    
    </li>
    <li id="chap2link">Chapter 2
     <input id="chap2value" type="hidden" value="See how they run like pigs from a gun, see how they fly" />
    </li>
    <li id="chap3link">Chapter 3
    <input id="chap3value" type="hidden" value="I'm crying" />
    </li>
</ul>

そして、次のjsコード：

$(".chapter-items li").click(function(){    
    $("#courseText").val($(this).find('input[type=hidden]').val());
});

サンプル2

于 2013-03-10T07:43:57.473 に答える