jquery - 一次点击一个来自 OPML 的是/否问题

Question

基于我的 xhtml 中被标记为 OPML 节点的流程图，我想动态地(使用 jquery，无需刷新页面)获取一一显示的问题，具体取决于前一个问题的是/否答案，直到出现OPML 中的最终消息已到达。例如;

Q: Do you have a pet?
A: yes

Q: Is it big?
A: yes

Q: Is it a dog?
A: yes

Final:Please note that dogs are not allowed at this event!

该机制类似于提议的 in this SO question 。然而，需要对每个问题和答复进行编码。我正在寻找一种方法来编写代码，您可以在其中添加任何 OPML，并且它会自动创建该行为。

[编辑] 作为关闭 javascript 时的可读回退，并避免解析外部 OPML，最好使用 XOXO an outline microformat而不是 OPML。

Answer 1

你可以这样做:http://jsfiddle.net/kayen/fGrT2/

HTML:

<div id="petTest">
    <fieldset>
        <legend>Do you have a pet?</legend>
        <ul>
            <li><label for=""><input type="radio" name="petstatus" value="Yes" /> Yes</label></li>
            <li><label for=""><input type="radio" name="petstatus" value="No" /> No</label></li>
        </ul>
    </fieldset>

    <fieldset>
        <legend>Is it big?</legend>
        <ul>
            <li><label for=""><input type="radio" name="petsize" value="Yes" /> Yes</label></li>
            <li><label for=""><input type="radio" name="petsize" value="No" /> No</label></li>
        </ul>
    </fieldset>

    <fieldset>
        <legend>Is it a dog?</legend>
        <ul>
            <li><label for=""><input type="radio" name="pettype" value="Yes" /> Yes</label></li>
            <li><label for=""><input type="radio" name="pettype" value="No" /> No</label></li>
        </ul>
    </fieldset>
    <fieldset>
        <legend>Please note that dogs are not allowed at this event!</legend>
    </fieldset> 
</div>

JQuery:

$("#petTest fieldset")
    .hide()
    .eq(0).show()
    .end()
    .find("input[value='Yes']")
    .click(function() {
      $(this).parents("fieldset").next().show(300);
    })
    .end()
    .find("input[value='No']")
    .click(function() {
        $(this).parents("fieldset").nextAll().hide(300, function(){
            $(this).find("input").attr("checked", false);                
        });
    });