Question

您好我有以下代码但无法使其正常工作。我想在选中两个复选框后显示链接。

HTML：

<div><input id="dp-terms" name="terms" type="checkbox" value="1" /> I have read and agree       to your terms and conditions</div>
<div><input id="dp-artwork" name="artwork" type="checkbox" value="1" /> I have read and undertand your artwork guide</div>
<div id="show-continue" style="display:none;"><a href="#">Next ></a></div>

jQuery的;

$(document).ready(function(){
    $("#dp-terms, #dp-artwork").change(function() {       
        if ($("input#dp-terms").checked && ("input#dp-artwork").checked) {
            $("#show-continue").show();
        } else {
            $("#show-continue").hide();
        };
    });
});

http://jsfiddle.net/dannyj6/EJZuC/

Answer 1

$(document).ready(function () {
    $("#dp-terms, #dp-artwork").change(function () {
        $("#show-continue").css('display', ($("#dp-terms").is(':checked') && $("#dp-artwork").is(':checked')) ? '' : 'none');
    });
});

<强> jsFiddle example

Answer 2

checked是DOM节点上的属性，而不是jQuery对象，因此您必须编写：

$("input#dp-terms")[0].checked

当您尝试检查第二个复选框时，您也忘记了美元符号。这是工作代码：

$(document).ready(function(){
    $("#dp-terms, #dp-artwork").change(function() {       
        if ($("input#dp-terms")[0].checked && $("input#dp-artwork")[0].checked) {
            $("#show-continue").show();
        } else {
            $("#show-continue").hide();
        };
    });
});

小提琴：http://jsfiddle.net/EJZuC/2/

Answer 3

尝试

$(document).ready(function(){
    $("#dp-terms, #dp-artwork").click(function() {      
        alert('in');
        if ($("input#dp-terms").is(":checked") && $("input#dp-artwork").is(":checked") ) {
            $("#show-continue").show();
        } else {
            $("#show-continue").hide();
        };
    });
});

小提琴：http://jsfiddle.net/EJZuC/3/

如果勾选了2个复选框，则执行jquery功能

3 个答案: