Javascript 使用jQuery和jQueryUI显示/隐藏div

我对此很陌生，知识有限（过去几周都是自学）。我试过很多其他人问过的类似问题的解决方案，但似乎都不适合我

我试图将“日期范围”div设置为仅在选择“范围”过滤器时可见。我正在使用jQuery1.8.2和jQueryUI 1.9（设置为$.noConflict（）；）

我的代码如下（请友好，我知道我不是很擅长这个），任何帮助都是感激的

<script>
$('#filters').is(function() {
if ($('#range').attr('checked')) {
    $('#date_range').show();
} else {
    $('#date_range').hide();
}
});
</script>

    <div>
        <form align="center" id="filters">
            <input type="radio" id="last24" name="filter_radio" checked="checked"/><label for="last24">Last 24hrs</label>
            <input type="radio" id="WTD" name="filter_radio" /><label for="WTD">WTD</label>
            <input type="radio" id="last_week" name="filter_radio" /><label for="last_week">Last Week</label>
            <input type="radio" id="range" name="filter_radio" /><label for="range">Range</label>
                <div id="date_range">
                    <br />
            <label for="from">From: </label><input type="text" id="from" name="from"/>
            <label for="to">To: </label><input type="text" id="to" name="to" />
                </div>
        </form>     
    </div>

$（“#过滤器”）.is（函数（）{
if（$（'#range'）.attr（'checked'））{
$（“#日期范围”）.show（）；
}否则{
$（“#日期范围”）.hide（）；
}
});
过去24小时
WTD
上周
范围


发件人：
致：

试试这段代码

$(function(){

    $('#date_range').hide();

    $('#filters').on('click' ,'input[type=radio]', function(){
        if (this.id == "range" && this.checked) {
            $('#date_range').show();
        } else {
            $('#date_range').hide();
        }
    });

});

选中此项

---

希望这会有所帮助

您可以通过此

$('#date_range').hide();

$('[name=filter_radio]').on('click', function(){
    if($('#range').is(':checked')){
        $('#date_range').show();
    } else {
        $('#date_range').hide();
    }
});

希望它简单明了。

试试下面的代码：-

这是要隐藏和显示的jquery:-

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js" ></script>
<script>
function asfd(str)
{
if(str==true)
{
jQuery('div#renew').show();
}
else
{
jQuery('div#renew').hide();
}
}
</script>

<input type="checkbox" autocomplete="off" onchange="asfd(this.checked);"/>

<div id="renew" style="display: none ;">
........Content.........
</div>

功能asfd（str）
{
如果（str==true）
{
jQuery（'div#renew'）.show（）；
}
其他的
{
jQuery（'div#renew'）.hide（）；
}
}

这是Jquery函数调用的地方：-

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js" ></script>
<script>
function asfd(str)
{
if(str==true)
{
jQuery('div#renew').show();
}
else
{
jQuery('div#renew').hide();
}
}
</script>

<input type="checkbox" autocomplete="off" onchange="asfd(this.checked);"/>

<div id="renew" style="display: none ;">
........Content.........
</div>

这是将隐藏或显示的div:-

<script type="text/javascript" src="http://code.jquery.com/jquery.min.js" ></script>
<script>
function asfd(str)
{
if(str==true)
{
jQuery('div#renew').show();
}
else
{
jQuery('div#renew').hide();
}
}
</script>

<input type="checkbox" autocomplete="off" onchange="asfd(this.checked);"/>

<div id="renew" style="display: none ;">
........Content.........
</div>

……内容。。。。。。。。。

您可以试试这个

标记：

<label><input id="last24" type="radio" name="filter_radio" value="1" />Last 24hrs</label>
<label><input id="WTD" type="radio" name="filter_radio" value="2" />WTD</label>
<label><input id="last_week" type="radio" name="filter_radio" value="3" />Last Week</label>
<label><input id="range" type="radio" name="filter_radio" value="4" />Range</label>

<div id="filter_radio-4" class="toHide" style="display:none">
    <br />
            <label for="from">From: </label><input type="text" id="from" name="from"/>
            <label for="to">To: </label><input type="text" id="to" name="to" />
</div>

$(function() {
    $("[name=filter_radio]").click(function(){
            $('.toHide').hide();
            $("#filter_radio-"+$(this).val()).show('slow');
    });
 });​

---

演示：

缺少$（函数（）{}）；围绕jquery。感谢您的回复。问题是，我计划分配单选按钮的时间范围，以允许它们过滤从oracle数据库提取的数据。谢谢，这非常有效，我在这过程中学到了一些东西。这有时会导致闪烁。有什么办法可以避免吗？