如果4個輸入中的任何一個匹配值，顯示div？

我有4個問題，每個問題都有一個文本鏈接的形式是和沒有答案。每個文本鏈接都會將值發送到專門的隱藏字段以解答該問題。所有這一切都工作完美，因爲它是...如果4個輸入中的任何一個匹配值，顯示div？

但是，當這些隱藏值中的任何一個等於「是」我想要顯示一個div，讓我們只是說這個div有內容「你回答是一個的問題「。

這是我當前如何獲取是/否價值的領域：http://jsfiddle.net/w3yuv4Lw/

我有過類似的想法：

if ($("#question1a,#question1b,#question1c").filter(function() 
    { return $(this).val(); }).length > 1) 
    }

正如我已經設置默認爲值爲x，但也沒有值，所以我真的需要它匹配「是」，然後顯示div。

我必須誠實，但我真的不知道如何去做。

來源

2014-09-04 BN83

其實答案也有問題。它只檢查最後的值而不檢查已經設定的值。所以如果一個盒子有yes，最新值是no它會再次隱藏div。這也是解決這個問題後的答案。它適用於任何情況。

<div id="dv" style="display:none;"> Congrats! Correct answer. </div> 

$('a[class*="question"]').on('click', function() { 
$("#dv").css("display", "none"); 
var answer = $(this).attr('href').split('=')[1]; 
$('#' + $(this).prop('class')).val(answer); 
check(); 
}); 
function check() { 
    var ans1 = $("#questionOne").val(); 
    var ans2 = $("#questionTwo").val(); 
    if(ans1=='yes'||ans2=='yes') 
    { 
     $("#dv").css("display", "block"); 
    } 
}

UpdatedDEMO

來源

2014-09-04 19:11:59

不幸的是，這顯示了div是否單擊是或否。編輯：好吧，不顯示，如果你點擊任一，但它不會消失，當你點擊「否」。 – BN83 2014-09-04 19:13:29

事實上，賽義德的答案是有效的 - 他只是錯過了在任何點擊之後重新隱藏#dv div的需求，以防止點擊是否。請參閱http://jsfiddle.net/w3yuv4Lw/7/（Syed，隨時將您的jsFiddle參考切換到這一個） – gibberish 2014-09-04 19:18:05

@gibberish：感謝您的編輯。我忘了，但我更新了答案。再次感謝:) – 2014-09-04 19:21:04

您可以使用append()到HTML添加到您的網頁：

if(answer == "yes" && $("#yes").length==0){ 
    var html = '<div id="yes">You answered yes to one of the questions!</div>'; 
    $(this).append(html); 
}

變化$(this).append(html);的this無論你要放置HTML。例如，您可以在頁面上創建一個空的<div>，如<div id="stuff"></div>，然後$("#stuff").append(html);將HTML放入該div內。

如果要防止附加的<div id="yes">被多次附加，請將條件添加到if語句中，並使用length()函數，該函數檢查元素在頁面上的顯示次數。

要當用戶點擊「否」這樣做刪除文本：只要

#div_to_show {display:none;} 
input[type=hidden][value="yes"] ~ #div_to_show {display:block;}

這將工作：

if(answer == "no"){ 
    $("#yes").remove(); 
}

JS Fiddle Demo

來源

2014-09-04 19:02:17 Dan

不幸的是如果您單擊Yes，那麼沒有，然後是再次，它創造的「你好」另一條線。我只是想讓它顯示一個預定義的隱藏div。 – BN83 2014-09-04 19:10:25

瞭解，這是沒有在原始問題中指定，但檢查出選項2 – Dan 2014-09-04 19:12:08

謝謝，但不幸的是，如果你點擊是，那麼顯示div，然後否。如果再次選擇了錯誤的選項，它可以刪除div嗎？ – BN83 2014-09-04 19:16:16

試試這個CSS代碼<input>和<div>有相同的家長。

來源

2014-09-04 19:07:01

如果4個輸入中的任何一個匹配值，顯示div？

回答

相關問題