且构网

分享程序员开发的那些事...
且构网 - 分享程序员编程开发的那些事

Jquery动态单选按钮显示隐藏

更新时间:2023-09-29 18:52:16

对于可能使用类似功能的用户,这里是我使用的。这是因为在css中标记为隐藏的隐藏字段预先导致问题。因此,当页面加载时,我指定隐藏,以避免此。

For those of you who may use a similar feature, here is what I used. It is such because having the hidden field marked as hidden in css beforehand causes issues. So I assign the hidden when the page is loaded to avoid this.

$(document).ready(function(){
    $('.hideable').css('display','none');
    $('.clickme').each(function(){
                var relreset = '.'+$(this).attr('rel');
                if(this.checked == true){       
                    $(relreset).fadeIn('fast');
                }else if(this.selected == true){
                    $(relset).fadeIn('fast');
                }else{
                    $(relreset).fadeOut('fast');
                }
            });

    $(".clickme").click(function(){
        $('.clickme').each(function(){
            var relreset = '.'+$(this).attr('rel');
            if(this.checked == true){       
                $(relreset).fadeIn('fast');
            }else if(this.selected == true){
                $(relset).fadeIn('fast');
            }else{
                $(relreset).fadeOut('fast');
            }
        });
    });
});

从这里我们要做的是给checkbox,radio等,class = 点我。这是什么使得函数监听点击。在收音机上,我们需要确保每一个都有类。

From here what we're going to do is give the checkbox, radio, etc, the class="clickme". This is what makes the function listen for clicks. On a radio set we need to make sure that each one has the class.

从这里我们添加rel =someuniquename到复选框,收音机等。这是要传递我们要隐藏的元素的类。因此,我们将通过类匹配元素。

From here we add rel="someuniquename" to the checkbox, radio, etc. This is going to pass the class of the element we're going to hide. So we'll match it up with the element through the class.

例如(使用coldfusion,因此#)。

So for example(using coldfusion, hence the #'s)).

将传递具有rel_#minimum_qualifications_id#类的影响元素。所以我们的元素看起来像这样:

Would pass the affect elements with the rel_#minimum_qualifications_id# class. So our element would look something like this:

注意有一个类可隐藏在那里。如果元素在开始时未被选中,则隐藏元素。否则,你必须等待一个点击隐藏的东西。这将替换任何style =display:none的。我们必须这样做,否则你会得到一些显示问题。

Notice that there is a class hideable in there as well. This hides the element if it's not selected in the beginning. Otherwise you'd have to wait for a click to hide things. This will replace any style="display:none"'s. We have to do it this way otherwise you'll get some display issues.