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 - 基於用戶輸入顯示結果

回答

相關問題