根据我的xhtml中标记为OPML节点的流程图,我想动态地(使用jquery,而不刷新页面)逐一显示问题,具体取决于上一个的是/否答案,直到出现最后一条消息。达到OPML。例如;
问:你有宠物吗?答:是的
问:大吗?答:是的
问:是狗吗?答:是的
结束:请注意,此活动不允许狗入内!
该机制类似于提出的in this SO question。但是,需要对每个问题和答复进行编码。我正在寻找一种可以编写任何OPML的代码,它将自动创建该行为。
[edit]作为关闭javascript时的可读备用,并且为了避免解析外部OPML,最好使用XOXO an outline microformat代替OPML。
最佳答案
您可以执行以下操作: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);
});
});