0

I have, what on initial viewing, is a simple requirement to show/hide two divs based on a users response to radio buttons.

See the JsFiddle: http://jsfiddle.net/P75cv/

The real complexity is as follows.

Div one is to be shown if any of the questions has a radio button value of 2 or 1. Div two is only to be shown if any of the questions don't have a value of 2, 1 or -1.

However, I also need a further check to do the following, if div one has been shown and a user goes back and changes their response so that no radio buttons have a value or 2 or 1, then div one needs to be hidden and div two shown. Similarly, if div two is being shown but the user goes back and changes their responses so that any of the radio buttons have a value of 2 or 1, div two needs to be hidden and div one shown.

And finally, the user has the option of saving and coming back to the page - if they do, I need the right div to be shown based (on page load?).

The simple part of showing and hiding divs I can do, in both jQuery and Javascript but this level of complexity is really causing me a headache - can anyone offer an insights or solutions?

4

2 回答 2

0

我将创建执行显示/隐藏例程的基本功能。然后填充一个包含所有单选按钮值的数组，检查数组是否包含您要查找的值，然后调用正确的函数。

我会使用 JQuery cookie 来存储用户保存并返回页面时应该显示的 div。

于 2013-07-24T16:06:06.273 回答
0

所以，回答我自己的问题 - 我使用了以下代码：

<?php
function checking() {
count = 0;
";
for ($i=1; $i<=10; $i++){
echo"   q".$i." = $('input[name=\"q".$i."\"]:checked').val();
    if(q".$i." == 1 || q".$i." == 2){
            document.getElementById('disagree').style.display = 'block';
            document.getElementById('agree').style.display = 'none';
        count = 1;
    }
    ";

    }

    echo" 

    if (count==0){
        document.getElementById('disagree').style.display = 'none';
        document.getElementById('agree').style.display = 'block';
    }

}
?>

如您所见，我在页面上有 10 个问题，并使用 PHP 编写脚本并且它可以工作。我毫不怀疑有更有效和更优雅的方式来实现同样的目标。

于 2013-07-24T16:59:39.597 回答