JQuery:显示/隐藏带有复选框的文本框

我有6个复选框和6个文本框，如下脚本所示

当我选中复选框单选按钮功能时，会显示相应的文本框。。但是，当我移动到选中其他复选框时，在取消选中复选框之前，为上一个复选框显示的文本框不会被隐藏

---

…提前感谢

单击某个框时，应隐藏所有文本框，然后显示所单击按钮的文本框。我所做的是将id='table'添加到table元素中，然后在lettyp类的代码下添加以下代码：

$('#table input[type="text"]').hide();

---

这将选择所有文本框并将其全部隐藏。然后，您的代码在此之后继续，并显示所选的框。

我想这可能就是您试图使用所有这些代码所做的，不太确定，因为我只完成了一半

$(function() {
    $('[id^="typ"]').hide();
    $(".lettertyp").on('change', function() {
        $(".lettertyp").not(this).prop('checked', false);
        $('[id^="typ"]').hide();
        $("#"+this.id.replace('letter', '')).toggle(this.checked);
    });
});

好吧，那么巴勒桑德尔

---

一个更简单的代码怎么样

实例：

第一次参观酒店 重复参观酒店 鱼缸 大型聚会 通用的 公司营销 Javascript

$function{ //隐藏所有文本输入 隐藏输入； //无线电点击 $ul输入[type='checkbox']。单击函数{ //当前 var li=$this.closestli； //显示它的文本 li.findinput[type='text'].show； //再次隐藏 隐藏输入； }; }; 函数HIDEALLTEXT输入{ //隐藏所有文本输入 $ul输入[type='checkbox'] .不是：检查过了 closestli先生 .findinput[type='text'] 隐藏 }

---

看起来您为每个文本框编写了单独的事件。此代码只需一个事件即可完全实现

$(function() {
    // Hide all Textboxes on DOM ready
    $('.typ').hide();

    //Create the click event for check box
    $('input[type="checkbox"]').on('click', function() {
        // Hide All Text Boxes
        $('.typ').hide();
        var isChecked = $(this).is(':checked');
        if(isChecked){  
            // Uncheck ALl the checkboxes
            $('.lettertyp').attr('checked', false);
            // Check curret checkbox
            $(this).attr('checked', true);
            // Find the Sibling of the TextBox and SHow it
            $(this).parent().parent().find('input[type=text]').show();
        }         
        else{
        }   
    });
});​

---

勾选此处

如果您想要单选按钮功能，为什么要使用复选框？他不希望这样-他希望每个带有复选框的txt框都可见-可能会有multiple@ScottSelby-我不这么认为，因为他说他想要单选按钮功能。查看他的JSFIDLE，在您选择另一个复选框后，旧的复选框将被关闭。@Aust为了只是隐藏，您不需要遍历每个元素，您可以轻松地执行：$'table input[type=text]'。hide；谁知道呢，我要去sleep@ScottSelby-我刚刚删除了它，重新开始，从所有这些文档中感到头疼。准备好了吗，但我认为这符合要求，但我不确定？然后再次。。你在重复你自己。。。试着更聪明地编码：很好，但是。。。它并不代表问题的行为：在我们取消选中复选框之前，为上一个复选框显示的文本框不会被隐藏；是 啊这就是问题所在。。。所以我把它修好了。。。您不必取消选中该框来隐藏文本框，只需单击另一个即可。。。这是我理解它的方式代码看起来更好，但复选框没有单选按钮functionality@Ram你需要指定你想要的是什么，在你的问题中你提到的文本框显示的前一个复选框是不会被隐藏的，直到我们取消选中复选框，这就是它所做的。如果您想要单选功能，为什么不直接使用单选按钮呢？用通俗易懂的英语告诉我你真正想要的是什么，这样我们才能理解。我想他已经有了答案。。。有些人知道他想要什么

//Select Promo Letter Type 
$(document).ready(function(){
    //Hide all textboxes   
    $('.typ').hide();

    //CheckBoxes behaviour
    $(".lettertyp").click(function(){
        $(".lettertyp").attr('checked',false);
        $(this).attr('checked', true);
        $('.typ').hide();
        var id = $(this).attr('id');
        id = id.substr(id.length - 1);
        $('#typ' + id).show();
    });
});

$(function() {
    // Hide all Textboxes on DOM ready
    $('.typ').hide();

    //Create the click event for check box
    $('input[type="checkbox"]').on('click', function() {
        // Hide All Text Boxes
        $('.typ').hide();
        var isChecked = $(this).is(':checked');
        if(isChecked){  
            // Uncheck ALl the checkboxes
            $('.lettertyp').attr('checked', false);
            // Check curret checkbox
            $(this).attr('checked', true);
            // Find the Sibling of the TextBox and SHow it
            $(this).parent().parent().find('input[type=text]').show();
        }         
        else{
        }   
    });
});​