JavaScript - Encuesta en JavaScript

   
Vista:
Imágen de perfil de Vivianne

Encuesta en JavaScript

Publicado por Vivianne (1 intervención) el 21/02/2011 15:53:06
necesito una mano con esta encuesta que estoy creando, basicamente lo que quiero hacer es ofrecer publicidad, pero necesito validar el sexo de la persona y la edad, para que no todo el mundo reciba la misma publicidad, ya tengo todo creado sin embargo estoy teniendo problemas con las funciones, no puedo pasarles las variables sexo y edad para que las valide, alguien que peuda ayudarme en esto gracias, aqui dejo mi codigo

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html><head><!-- Localized -->


<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="robots" content="noindex,nofollow">
<title>Visitor Survey - Please Take A Minute...</title>
<link href="survey_files/style.css" rel="stylesheet" type="text/css">
<script type="text/javascript" src="survey_files/jquery.js"></script>
<script>

var genero = null;
var edad = null;

function q1() {
$('#q1').hide();
$('#q2').show();
}

function q2() {
$('#q2').hide();
$('#q2').show();
}

function q2() {
$('#q2').hide();
$('#loader').show();
setTimeout(showProducts, 1500);
}


function setgender(g) {
if (g == 'f') {
genero = 'f';
}
if (g == 'm') {
genero = 'm';
}

function setage (a) {
if (a == '1017') {
edad = '1017';
}

if (a == '1825') {
edad = '1825';
}

if (a == '2639') {
edad = '2639';
}

if (a == '40') {
edad = '40';
}


}

function showProducts() {
$('#loader').hide();

$('#products').show();

if ( genero == 'f' && edad == '1017') {

document.getElementById('fgift').style.display = 'block';
}


if ( genero == 'm' && edad == '1017') {

document.getElementById('mgift').style.display = 'block';
}




}


}

</script>
<style>
.hoverspan {
background-color:transparent;
color:#000000;
}
.hoverspan:hover {
background-color:#D9D9D9;
color:#000000;
}

.btn {
cursor:pointer;
}

.clear{clear:both;}

html, body {
height:100%;
padding:0;
margin:0;
background-color:#D8D8D8;
}
#wrapper {
min-height: 100%;
height: auto !important;
height: 100%;
}
.footer, .push {
height: 4em;
font-size:10px;
width:90%;
line-height:14px;
padding:20px;
text-align:center;
}
</style>
</head><body>
<div id="wrapper" style="margin: 0pt auto;">
<div id="content">
<div id="header" style="margin-left: 50px; padding-top: 12px;">
<img src="survey_files/thankyou.png" alt="Thank You" title="Thank You" border="0">
</div>
<div id="leftbox" style="width: 306px; height: 336px;">
<p class="header">Dear Visitor,</p>
<p>You've been selected to take part in our anonymous
survey. Complete this 30 second questionnaire, and to say "thank you",
we'll offer you a few exclusive prizes including a WalMart or Best Buy
Gift Card. </p><p><br>This offer is available today only:
</p>

</div>
<div id="rightbox">
<form name="">
<div id="q1">
<p> </p>
Question 1 of 3:<br>
Are you male or female?<br>

<div class="hoverspan" onclick="javascript:setgender('m'); javascript:q1();" style="padding: 2px; margin: 2px;">
<input id="q1_a1" onclick="javascript:setgender('m'); q1();" type="radio"><label id="male">Male</label>
</div>
<div class="hoverspan" onclick="javascript:setgender('f'); javascript:q1();" style="padding: 2px; margin: 2px;">
<input id="q1_a2" onclick="javascript:setgender('f'); q1();" type="radio"><label id="female">Female</label>
</div>


</div>

<div id="q2" style="display: none;">
<p> </p>
Question 2 of 3:<br>
How old are you?<br>

<div class="hoverspan" onclick="javascript:setage('1017'); javascript:q2();" style="padding: 2px; margin: 2px;">
<input id="q2_a1" onclick=" javascript:setage('1017'); q2();" type="radio"><label id="age">10-17</label>
</div>
<div class="hoverspan" onclick="javascript:setage('1825'); javascript:q2();" style="padding: 2px; margin: 2px;">
<input id="q2_a2" onclick="javascript:setage('1825'); q2();" type="radio"><label id="age">18-25</label>
</div>
<div class="hoverspan" onclick="javascript:setage('2639'); javascript:q2();" style="padding: 2px; margin: 2px;">
<input id="q2_a3" onclick=" javascript:setage('2639'); q2();" type="radio"><label id="age">26-39</label>
</div>
<div class="hoverspan" onclick="javascript:setage('40'); javascript:q2();" style="padding: 2px; margin: 2px;">
<input id="q2_a4" onclick="javascript:setage('40'); q2();" type="radio"><label id="age">40+</label>
</div>

</div>




<div id="loader" style="display: none; text-align: center;">
<p> </p>
<p>Thank you for your responses!</p>
<p><img src="survey_files/loader.gif" alt="loading..." title="loading..."></p>
<p>Submitting your answers...</p>
</div>
</form>


<div id="products" style="display: none;">
<p>Thank you for participating in our survey! Please select your prize!</p>

<div>
<table id="fgift" style="display: none;" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><tr id="gift2" class="hoverspan" onclick="PreventExitSplash=true; location.href='victorias.php';" style="cursor: pointer;">
<td style="padding: 0pt 5px 5px 0pt;"><img src="survey_files/vs2.jpg" id="vs"></td>
<td class="mid"><p><b>  $1,000 Victoria's   Secret Gift Card</b></p>  Quantity Left: 3</td>
<td class="right" align="right"><form method="post" action="victorias.php"><input value="Choose Victoria's" class="btn" onclick="PreventExitSplash=true;" type="submit"></form></td>
</tr></tbody></table>


<table id="mgift" style="display: none;" border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><tr id="gift2" class="hoverspan" onclick="PreventExitSplash=true; location.href='walmart.php';" style="cursor: pointer;">
<td style="padding: 0pt 5px 5px 0pt;"><img src="survey_files/walmart.jpg" id="walmart"></td>
<td class="mid"><p><b> $1,000 WalMart Gift  Card</b></p> Quantity Left: 2</td>
<td class="right" align="right"><form method="post" action="walmart.php"><input value="Choose WalMart" class="btn" onclick="PreventExitSplash=true;" type="submit"></form></td>
</tr>
</tbody></table>

<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody><tr id="gift2" class="hoverspan" onclick="PreventExitSplash=true; location.href='bestbuy.php';" style="cursor: pointer;">
<td style="padding: 0pt 5px 5px 0pt;"><img src="survey_files/bestbuy.jpg" id="bestbuy"></td>
<td class="mid"><p><b> $1,000 Best Buy Gift  Card</b></p>Quantity Left: 4</td>
<td class="right" align="right"><form method="post" action="bestbuy.php"><input value="Choose Best Buy" class="btn" onclick="PreventExitSplash=true;" type="submit"></form></td>
</tr>
</tbody></table> </div>
</div>
</div>

<div class="clear"></div>

<div class="push"></div>
</div>

<div id="footer" class="footer" style="margin: -100px auto 0pt; text-align: center;">

</div>

<embed src="survey_files/nifty.swf" quality="high" bgcolor="#FFFFFF" name="niftyPlayer1" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" height="1" width="1">

</div></body></html>
Valora esta pregunta
Me gusta: Está pregunta es útil y esta claraNo me gusta: Está pregunta no esta clara o no es útil
0
Responder

RE:Encuesta en JavaScript

Publicado por nkox (13 intervenciones) el 23/02/2011 22:08:05
Hola

Te falta cerrar la función setage.

Por cierto, algunas sugerencias...
1) añadir el atributo type al tag <script>
2) dado que usas jquery, puedes mostrar u ocultar un div usando la función toggle: $("#identificador").toggle();
3) tienes dos funciones q2
4) no es necesario añadir javascript: en los eventos onclick (o el que sea).

Saludos
Valora esta respuesta
Me gusta: Está respuesta es útil y esta claraNo me gusta: Está respuesta no esta clara o no es útil
0
Comentar