Question

<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位置。

我一直在与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);
    }
});

Answer 1

<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>

ID必须是唯一的，并且href必须以http://

开头

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

正确的语法是val()而不是va()

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

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

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

现在正在OP工作

window.location不会在条件下执行

1 个答案: