Question

我有一堆包含输入字段的列表项，当单击列表项时，id就像检查子项一样，这是否可用？

function setupToptions() {
    if ($('ul.top-options input').length) {
        $('ul.top-options li').each(function(){ 
            $(this).removeClass('active');
        });
        $('ul.top-options li input:checked').each(function(){ 
            $(this).parent('li').addClass('active');
        });                
    };
};

$(document).ready(function() {
    // Top options select
    $('ul.top-options li').click(function(){
        setupToptions();
    });
    setupToptions();
});

http://jsfiddle.net/BKgdc/1/

Answer 1

您只需在子输入上设置选中的值，如下所示：

$(document).ready(function() {
    // Top options select
    $('ul.top-options li').click(function(){
        $(this).find('input:radio').prop('checked', true); // Add this line     
        setupToptions();
    });
    setupToptions();
});

http://jsfiddle.net/BKgdc/2/

Answer 2

不是最好的答案（因为我已经改变了所有内容），但只是一个没有setupToptions功能的可能解决方案：

$(document).ready(function() {

    $li = $('ul.top-options li');
    $li.click(function() {
        $li.removeClass('active')
        .filter(this).addClass('active').find('input').prop('checked', true);
    });
    $li.filter(':has(:checked)').click();

});

http://jsfiddle.net/BKgdc/4/

Answer 3

你可以很容易地做到这一点。只需添加此代码。

$("li").click(function(){
    $(this).find("input").attr('checked', 'checked');
});

Answer 4

您可以添加代码：

$('input', this).attr('checked', 'true');

到li点击功能。

jsFiddle

Answer 5

完整的方法是注册父项的click和单选按钮的change。同样值得注意的是，这可以在没有JavaScript的情况下实现，正确使用label ...但是为了问题，这里是JavaScript。

// the click
function setChecked() {
    $('input', this).prop('checked', true).change();
}

// the change
function updateActive() {
    $('ul.top-options li').removeClass('active')
        .find('input:checked')
        .parent()
        .addClass('active');
}

// hooking it together
$(document).ready(function() {
    $('ul.top-options li').click(setChecked).find('input').change(updateActive);
});

使用jquery检查父单击时的输入框

5 个答案:

jsFiddle

jsFiddle demo