4

基于在我的 xhtml 中记为 OPML 节点的流程图，我想动态地（使用 jquery，不刷新页面）得到一个一个显示的问题，具体取决于前一个问题的是/否答案，直到最后一条消息达到 OPML。例如;

问：你有宠物吗？
答：是的

问：大吗？
答：是的

问：是狗吗？
答：是的

决赛：请注意，本次活动不允许携带宠物狗！

该机制类似于此 SO question 中提出的机制。然而，它需要为每个问题和回复进行编码。我正在寻找一种编写代码的方法，您可以在其中使用任何 OPML，它会自动创建该行为。

[编辑] 作为关闭 javascript 时的可读后备，并避免解析外部 OPML，使用XOXO 大纲微格式而不是 OPML 可能会更好。

4

1 回答 1

0

你可以这样做：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>

查询：

$("#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);                
        });
    });
于 2012-04-13T13:44:28.213 回答