Question

我有4个问题，每个问题都有文本链接形式的是和否答案。每个文本链接都会将值发送到专用的隐藏字段，以便回答该问题。所有这一切都很完美，因为它......

然而，当这些隐藏值中的任何一个等于“是”时，我想显示一个div，让我们说这个div的内容是“你对其中一个问题回答是”。

这就是我目前获得该字段的是/否值的方式：http://jsfiddle.net/w3yuv4Lw/

我有想法：

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

因为我已经将值的默认值设置为x，但是也没有值，所以我真的需要它匹配“是”然后显示div。

我必须诚实，但我真的不知道该怎么做。

Answer 1

实际上答案也有问题。它仅检查最后一个值，而不是已设置的值。因此，如果一个框具有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

Answer 2

您可以使用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中的$(this).append(html);更改为您要放置HTML的位置。例如，您可以在页面上创建一个空的<div>，例如<div id="stuff"></div>，然后$("#stuff").append(html);会将HTML放在该div中。

如果要阻止多次附加<div id="yes">，请在if语句中添加一个条件，然后使用length()函数检查元素出现在一个元素上的次数。页。

当用户点击＆＃34; no＆＃34;时删除文字这样做：

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

<强> JS Fiddle Demo

Answer 3

试试这个css代码：

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

只要<input>和<div> 相同的父母，此功能就会有效。

如果4个输入中的任何一个匹配值，则显示div？

3 个答案: