0

これが私がやろうとしていることです。スクリプトでコンテンツを取得し（これを行います）、別の div の下に配置します（これも行います）。リスト項目の 1 つをクリックすると、info という div 内のその段落が表示されるまで、段落はすべて非表示になります。これが私のスクリプトです。

$(document).ready(function() {
    var desc = $('.m-desc');
    var info = $(".desc li");
    var type = $('.type p');
    var part = $('.parts p');
    var paper = $('.paper p');
    var size = $('.size p');
    var imp = $('.imp-area p');
    $(".formFilling-preview").append(desc);
    $(type).hide();
    $('.parts').click(function() {
        $(".info").append(type);
        $(this).children().hide('slow');
    });
    $('.imp-area').click(function() {
        $(".info").append(imp);
    });
    $('.paper').click(function() {
        $(".info").append(paper);
    });
    $('.size').click(function() {
        $(".info").append(size);
    });
    $('.type').click(function() {
        $(".info").append(type);
        $(type).show();
    });
});

<div class="m-desc">
    <ul class="desc">
        <li class="type selected">Type:</li>
        <li class="parts">Parts: <p></p></li>
        <li class="paper">Paper Type: <p></p></li>
        <li class="size">Size: <p></p></li>
        <li class="imp-area">Imprint Area: <p></p></li> 
    </ul>
    <div class="info">
        <p style="display: none;">Lorem lipsum epsum</p></div>
    </div>

ここに私がセットアップしたjsfiddleがありますhttp://jsfiddle.net/cornelas/4mzgV/

4

1 に答える 1

0

これを試してください：

$(document).ready(function() {
    var desc = $('.m-desc');
    var descLi = $('.m-desc .desc li');
    var info = $('.info');

    $(".formFillingPreview").append(desc);
    descLi.click(function() {
        info.html($('p', $(this)).html());
        $('p', info).show();
    });
});

例全体を確認してください。

http://jsfiddle.net/4mzgV/28/

于 2012-10-24T16:24:11.503 に答える