<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>
ユーザーが欲しいのですが：
- リンクをクリックしてください
- リンクhrefを
$href変数に保存します - ユーザーがチェックボックスから選択した後、ユーザーをその
$href場所に移動します。
私はこのフィドルで働いてきました。
では、チェックボックスを選択したときに、リンクをそれぞれの場所に移動するにはどうすればよいですか？
誰かが助けや提案を提供できるなら; 本当にありがとうございます！
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);
}
});