2013-03-18 2 views
2
<a href="www.google.com" class="social" id="social">Link one</a> 
<a href="www.cnn.com" class="social" id="social">Link two</a> 
<a href="www.facebook.com" class="social" id="social">Link three</a> 

Я хотел бы иметь возможность пользователя:window.location не выполняет с условиями

  1. Нажмите на ссылку
  2. Have ссылки HREF магазина в $href переменную
  3. После того, как пользователь выбрал флажки, возьмите пользователя на $href.

Я работаю с this fiddle.

Так как я могу получить ссылки, чтобы перейти к их соответствующим местоположениям при выборе флажка?

Если бы кто-нибудь мог предложить какую-либо помощь или предложения; Я бы очень благодарен Спасибо!

p{ 
    display: inline-block; 
} 
input[type="checkbox"]:disabled + label{ 
    opacity: .5; 
} 
.faded{ color: grey; 
    opacity: .5; 
} 

<p>Links should go to their respective locations upon checkbox selection</p> 
<br> 

<a href="www.google.com" class="social" id="social">Link one</a> 
<a href="www.cnn.com" class="social" id="social">Link two</a> 
<a href="www.facebook.com" class="social" id="social">Link three</a> 

<div class="know-your-role"> 
    <div id="checkwrapper"> 
     <form method="POST" action=""> 
      <p>Are you a</p> 
      <input type="checkbox" id="check-1" class="checkchoice student" value="1"><label for="check-1" class="choice student tooltip" title="Student">Student</label> 
      <p>or</p> 
      <input type="checkbox" id="check-2" class="checkchoice teach" value="2"><label for="check-2" class="choice teach tooltip" style="padding-right: 20px;" title="Teacher">Teacher</label> 
      <p>?</p> 
     </form> 
    </div> 
    <div class="style-select type"> 
     <input type="text" placeholder="What year" /> 
    </div> 
    <p class="faded">  
    "What year" input should only appear when student is selected' 
    </p> 
</div> 

JavaScript

$('.type').hide(); 
$(".know-your-role").hide(); 


$(".social").click(function(e){ 
    e.preventDefault(); 
    var href = $(this).attr('href'); 
    $(".wizard").hide(); 
    $('.know-your-role').show('fast'); 
    var $student = $('input:checkbox.student'); 
    var $teach = $('input:checkbox.teach'); 

    if($student.is(':checked') & $(".year").va() != ""){ 
     window.location.href = href; 
    }else if ($teach.is(':checked')){ 
     window.location.href = href; 
    } 
}); 

$(function(){ 
    $('#check-1').change(function() { 
     $('#checkwrapper').hide(); 
     $('.type').css('width','110px') 
     $('.type').show(); 
    }); 
}); 

$('input:checkbox.checkchoice').click(function(){ 
    var $inputs = $('input:checkbox.checkchoice'); 
    if($(this).is(':checked')){ 
     $inputs.not(this).prop('disabled',true); 
    }else{ 
     $inputs.prop('disabled',false); 
    } 
}); 
+0

может быть, вы должны поместить весь код в $ (function() {}); – Ibu

+0

@Ibu Я пробовал это раньше, он все еще не смог выполнить window.location. – Modelesq

ответ

2
<a href="http://www.google.com" class="social">Link one</a> 
<a href="http://www.cnn.com" class="social">Link two</a> 
<a href="http://www.facebook.com" class="social">Link three</a> 

Идентификаторы должны быть уникальными, и HREF должно предшествовать http://

if($student.is(':checked') & $(".year").va() != ""){ 

Правильный синтаксис val() не va()

http://jsfiddle.net/knoxzin1/Jg8jT/20/

----------------------- EDITED ----------------- ----------------------

http://jsfiddle.net/knoxzin1/Jg8jT/29/

теперь работает как OP спросил

+0

Спасибо за помощь. Но я не знаю, что вы подразумеваете под «идентификаторы должны быть уникальными». Какие идентификаторы? – Modelesq

+0

'id =" social "' у вас есть это во всех элементах 'a', атрибут id должен быть уникальным во всех html-страницах –

+0

Так вы говорите для $ ('# social'). Each (function() { // do stuff}? – Modelesq

Смежные вопросы