JS/jQuery - 基于用户输入显示结果

我一直在想这个项目我已经采取，现在我所追求的是一个形式，将有一个问题清单，简单是/没有问题，当回答并提交它将动态地返回相同页面上的相关数据。所以最初所有的答案都会被加载到页面上然后隐藏起来，而且我计划选择和返回数据的方式是给每个元素提供每个问题的类，以及是或不是。类似于class="q1_0 q2_1 q3_1 q4_0"，其中0代表否，1代表是。您认为这是解决这个问题的好方法，还是更简单的选择？总而言之，我期待看看是否有人处理过可以提供帮助的jQuery插件？任何帮助一如既往，非常感谢。JS/jQuery - 基于用户输入显示结果

感谢，

-Josh

来源

2010-02-09 joshgillies

好吧，让我们假设你正在使用复选框让用户回答是/否的答案。进一步假设你的问题的顺序反映了你的答案在你的页面中排列的顺序。那么你就需要这样的事：

<ul> 
    <li class="relevant_data">Hi, I'm quite relevant to question 1</li> 
    <li class="relevant_data">Hi, I'm quite relevant to question 2</li> 

.... 

<input type="checkbox" class="question"/> Are you hungry? 
<input type="checkbox" class="question"/> Are you thirsty?

否jQuery的部分：

$questions = $('input.question'); 
$questions.bind('click', function() { 
    var pos = $questions.index(this), 
     item = $('ul li.relevant_data:eq('+pos+')'); 

    this.checked ? 
     item.hide() : item.show(); 
});

希望能对大家有所帮助的话。

来源

2010-02-09 23:59:10 aefxx

你所描述的将会起作用，尽管我当然不知道任何有助于它的插件。但是，如果你确实采取了这种方法，那么你应该绝对确信，不会有比“q1是，q2 no”更复杂的逻辑。例如，如果您需要“q1是，q2是或q4否”作为问题的展示条件，那么您的方案将无法处理它，并且您将结束黑客攻击或重新编写整个系统。

如果你确实认为你以后可能需要更复杂的逻辑，我会建议用纯JS来实现。例如：

function isYes(i) { 
    return $("#question" + i).is(":checked"); 
} 
var question1 = ["Is red your favorite color?", function() { 
    return isYes(1); 
}]; 
var question2 = ["Are dogs your favorite pet?", function() { 
    return isYes(1) && (isNo(4) || isYes(7); 
}];

类似的东西（加上逻辑来呈现的问题，并为他们的onChange处理触发的quesiton是否应显示或不检查）。

当然，你可能只想创建的，而不是使用数组一个“问题”类，你可能会想一个数组对象，而不是为每一个问题不同的变量，但是这只是一个简单的例子。无论如何，这样的方法将给你未来更多的力量和灵活性......但最初的工作比基于班级的想法还要多。

来源

2010-02-10 00:05:43 machineghost

JS/jQuery - 基于用户输入显示结果

回答

相关问题